osCommerce Main Categories Content Customization Example
Example 4-5: Add pointer image bullet to osCommerce Sub-categories
Let's combined what we learned before with the table design.
Add Pointer Image Bullet to osCommerce Sub-Categories
We learned this in previous osCommerce tutorial. See the codes highlight in BOLD green.
function tep_show_category($counter) {
global $tree, $categories_string, $cPath_array;
if ($counter == 1) {
echo "<table border=\"0\" width=\"100%\" cellspacing=\"0\" cellpadding=\"1\"
class=\"infoBox\" >" . "\n";
echo "<tr><td>" . "\n";
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 .= " "; // remove or comment this line
$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 .= '->';
}
$categories_string .= '</a>';
if (SHOW_COUNTS == 'true') {
$products_in_category = tep_count_products_in_category($counter);
if ($products_in_category > 0) {
$categories_string .= ' (' . $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";
echo "</td></tr>" . "\n";
echo "</table>" . "\n";
}
}
Here's the result:
The osCommerce Main Categories Content looks very nice now. Actually you can continue the customization. This is just up to your design imagination.