Home | Store | osCommerce Tutorials

osCommerce Main Categories Content Customization Example

Example 4-2: Add background color to Parent Categories of Main Categories Content


The osCommerce Main Categories is contained in a table in previous tutorial, we can now start customizing the look and feel of the osCommerce Main Categories.

Add Background color to Parent Categories

Let's try to add a background color to the Parent Categories only.

We noticed that some shop owners are using quite complicated methods to accomplish this result. Actually we only need to modify the previous codes a little.

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

if ($counter == 1) {
echo "<table border=\"1\" width=\"100%\" cellspacing=\"0\" cellpadding=\"3\"
class=\"infoBoxContents\" >" . "\n";
}

// start a new row, therefore need to set $categories_string to empty
$categories_string = '';

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 . ')';
}
}

// comment the line break since data will print in row
// $categories_string .= '<br>';

// If this is Parent Categories, add background color the the row
if ($tree[$counter]['parent'] == 0) {
echo "<tr><td bgcolor=\"#ffffcc\">";
} else {
echo "<tr><td>";
}

echo $categories_string;
echo "</td></tr>" . "\n";

if ($tree[$counter]['next_id'] != false) {
tep_show_category($tree[$counter]['next_id']);
} else { // Close the table if there is no more Categories
echo "</table>" . "\n";
}

}

Here's the result:

osCommerce Main Categories Customization example

osCommerce Main Categories Customization example

The osCommerce Main Categories looks quite good. We will do more customization on the osCommerce Main Categories Content in coming tutorials.