Zen Cart Multi Level Category Slide Out Menu

This hack is now available as a downloadable plugin from the Zen Cart site. Please visit this link to download it.

The plugin uses separate files of its own and doesn’t need any of the existing files to be updated.

The Zen Cart Category Menu shows only the sub categories of the currently selected category. Also the way it is shown is not visually great at all. With big category names and a few levels it gets uglier.

The solution can be a slide out menu. As the sub categories slide out, they will make their own room and not look ugly.

For this two modification needs to be made to the existing Zen Cart system.

1. Call all categories and subcategories in a single page
2. Make them slide out

Lets see the steps for the first requirement

1. Open the file includes\functions\functions_categories.php
2. Add the following function

////// Get ul li
function zen_get_categories_ul_li($categories_ul_li = '', $parent_id = '0', $cpath = '') {
global $db;

$categories_query = "select c.categories_id, cd.categories_name, c.categories_status
                     from " . TABLE_CATEGORIES . " c, " . TABLE_CATEGORIES_DESCRIPTION . " cd
					 where " . $zc_status . "
					 parent_id = '" . (int)$parent_id . "'
					 and c.categories_status = TRUE
					 and c.categories_id = cd.categories_id
					 and cd.language_id = '" . (int)$_SESSION['languages_id'] . "'
					 order by sort_order, cd.categories_name";
					 
$categories = $db->Execute($categories_query);
$categories_ul_li .= "
";
while (!$categories->EOF) {
$dpath = $cpath.$categories->fields['categories_id'];
$categories_ul_li .= "
".$categories->fields['categories_name'].'';
if ($categories->fields['categories_id'] != $parent_id) {
if(zen_has_category_subcategories($categories->fields['categories_id'])){
$categories_ul_li = zen_get_categories_ul_li($categories_ul_li, $categories->fields['categories_id'], $dpath.= "_");
}
$categories_ul_li .= "
";
$categories->MoveNext();
}
$categories_ul_li .= "
";
return $categories_ul_li;
}

3. Open the file includes\templates\{your_template_name}\sideboxes\tpl_categories.php
4. Comment out the entire loop –
for ($i=0;$i<sizeof($box_categories_array);$i++) { ….. }
5. After that add the following lines

$content .= '
';
$content .=  zen_get_categories_ul_li();
$content .= '
';

This would show the entire category / sub category using ul , li

Now for getting the slide out effect I have done the following

1. Download the slide out menu from DHTML Goodies – http://www.dhtmlgoodies.com/scripts/dhtmlgoodies-slide-out-menu/dhtmlgoodies-slide-out-menu.html
2. Use the slide out menu new version which supports multi level.

That’s it 😀