Collapsible CSS Category Menu v1.0 for osCommerce-MS2

by Chemo

What does this contribution do?

This contribution caches the category tree as a serialized array.  Upon each page call the script first checks to make sure the cache file exists and if so uses that data to populate the category tree.  If the file does not exist it calls tep_get_categories(), sets the $tree array, and then writes the data to the cache file.

Modifications by the store owner to the categories (rename, move, delete, etc.) are handled by the script to simply delete the cache file.  When a customer visits the store and the cache file in not present it will create it automatically.

The category menu is fully CSS driven and easy to modify for the individual store look and feel.  In addition, it is faster and less resource intensive than the traditional DHTML menu solutions.

Where can I see a live example?

MDofPC.com

How do I install this contribution?

STEP 1 - Upload the included new files

The files should be located in the upload directory of this contribution.

• admin/includes/category_cache.php
• includes/category_cache.php
• includes/boxes/css_categories.php

STEP 2 - Create a cache directory

Use your favorite FTP client and create a cache directory that gives the web server read/write permissions (chmod 777).

The safest place for the cache directory is OUTSIDE the web root so people won't be able to access it with a browser.

STEP 3 - Edit includes/category_cache.php and admin/includes/category_cache.php

Edit the $file variable and use the FULL filesystem path to the file including the name.

As an example: /home/username/cache/category_cache.

STEP 4 - Edit includes/application_top.php

Add this code just above the ending PHP tag ("?>"):

require('includes/category_cache.php');

STEP 5 - Edit admin/categories.php

Find this code:

if (tep_not_null($action)) {

Directly AFTER add this:

if (strpos($action, 'category')) include('includes/category_cache.php');

STEP 6 - Edit includes/column_left.php (or wherever you have the category menu)

Find this code:

if ((USE_CACHE == 'true') && empty($SID)) { echo tep_cache_categories_box(MODULE_CACHE_LIFETIME); } else { include(DIR_WS_BOXES . 'categories.php'); }

REPLACE with this:

NOTE: the original is just commented so going back to the original is easy.

/*--------------------------------------------------------*\ # Commented out to use the collapsible CSS menu category menu if ((USE_CACHE == 'true') && empty($SID)) { echo tep_cache_categories_box(MODULE_CACHE_LIFETIME); } else { include(DIR_WS_BOXES . 'categories.php'); } \*--------------------------------------------------------*/ include(DIR_WS_BOXES . 'css_categories.php');

STEP 7 - Edit includes/boxes/css_categories.php and customize

Instead of putting the CSS in the stylesheet and javascipt in the head tag I decided to put all customizations in the file itself. This cuts down on the number of file edits and simplies customization.

The menu is very customizable with respect to look and feel.  It is completely CSS driven and most every aspect can be tweaked with backgrounds, fonts, borders, etc.  I strongly suggest you look into a few online CSS tutorials and get some experience.

Notes

The installation is pretty straight forward and designed to be as easy as possible. 

Support

osCommerce is a community driven organization and as such the support base will fall entirely on the forum members. The base class is thoroughly commented and should be easy to follow for any coder. I offer limited support in-between paid projects (feeding my family comes first before volunteer time).

If you use this contribution and find it useful a small donation can be made via PayPal. This will enable me to offer one-on-one support and also fund releasing other contributions. In addition, if you make a donation it'll make you eligible for other performance optimization contributions that are not released!

Enter Donation amount: $

Credits

All work is orginal and nothing is borrowed.  Enjoy!