Home | Store | osCommerce Tutorials

osCommerce Main Categories Content Customization Example

Example 2 - Add image pointer bullets to sub-categories


Let's continue the osCommerce Main Categories customization. The sub-categories are indent to the left with two blank spaces. This is shown in the picture below:

osCommerce Main Categories Customization example

This is a bit boring. Let's replace the two blank spaces with pointer bullets. The codes (line 5) highlight in green color are showing the indent blank spaces.

function tep_show_category($counter) {
global $tree, $categories_string, $cPath_array;

for ($i=0; $i<$tree[$counter]['level']; $i++) {
$categories_string .= "&nbsp;&nbsp;";
}

$categories_string .= '<a href="';

if ($tree[$counter]['parent'] == 0) {
$cPath_new = 'cPath=' . $counter;
} else {
$cPath_new = 'cPath=' . $tree[$counter]['path'];
}

$categories_string .= tep_href_link(FILENAME_DEFAULT, $cPath_new) . '">';

if (isset($cPath_array) && in_array($counter, $cPath_array)) {
$categories_string .= '<b>';
}

// display category name
$categories_string .= $tree[$counter]['name'];

if (isset($cPath_array) && in_array($counter, $cPath_array)) {
$categories_string .= '</b>';
}

if (tep_has_category_subcategories($counter)) {
$categories_string .= '-&gt;';
}

$categories_string .= '</a>';

if (SHOW_COUNTS == 'true') {
$products_in_category = tep_count_products_in_category($counter);
if ($products_in_category > 0) {
$categories_string .= '&nbsp;(' . $products_in_category . ')';
}
}

$categories_string .= '<br>';

if ($tree[$counter]['next_id'] != false) {
tep_show_category($tree[$counter]['next_id']);
}

}

Add image bullet to sub-categories

1. Prepare an pointer image ( osCommerce sub-categories bullet) with the filename main_categories_bullet.gif.

2. Upload to catalog/images/ folder

3. Change the above codes in red color (line 5) as shown below:

function tep_show_category($counter) {
global $tree, $categories_string, $cPath_array;

for ($i=0; $i<$tree[$counter]['level']; $i++) {
$categories_string .= tep_image(DIR_WS_IMAGES . 'main_categories_bullet.gif', '');
}

$categories_string .= '<a href="';

if ($tree[$counter]['parent'] == 0) {
$cPath_new = 'cPath=' . $counter;
} else {
$cPath_new = 'cPath=' . $tree[$counter]['path'];
}

$categories_string .= tep_href_link(FILENAME_DEFAULT, $cPath_new) . '">';

if (isset($cPath_array) && in_array($counter, $cPath_array)) {
$categories_string .= '<b>';
}

// display category name
$categories_string .= $tree[$counter]['name'];

if (isset($cPath_array) && in_array($counter, $cPath_array)) {
$categories_string .= '</b>';
}

/*

if (tep_has_category_subcategories($counter)) {
$categories_string .= '-&gt;';
}

*/

$categories_string .= '</a>';

/*

if (SHOW_COUNTS == 'true') {
$products_in_category = tep_count_products_in_category($counter);
if ($products_in_category > 0) {
$categories_string .= '&nbsp;(' . $products_in_category . ')';
}
}

*/

$categories_string .= '<br>';

if ($tree[$counter]['next_id'] != false) {
tep_show_category($tree[$counter]['next_id']);
}

}

The result is shown as below:

osCommerce Main Categories Customization example

The following picture illustrate the osCommerce customization of the Main Categories content:

osCommerce customization

Now, we know how to add bullet pointers to the sub-categories of osCommerce Main Categories.