Category Manufacturer Tabs jQuery and osCommerce

At the official osCommerce forum this question was posed;

my client wants her website to have the same menu as website below

link removed! But here is a screenshot:

now is there a way that we can show brand which is manufactures in osc with a tab of category just like in the website above is there a addon or do i have to start from scratch.

And the question was answered like this:

the best way is to use jQuery tabs.

Now, as I like experimenting with jQuery and osCommerce, I decided to have a go at it – within 5 minutes I have it working, using the tutorial and demo at jquery for designers.

Step 1:
Set your manufacturers to show a list instead of a dropdown. This is an admin setting.

Step 2:
Open up the file /includes/column_left.php and get rid of everything in it. Then add only this code:

[php]

[/php]

Step 3:
Add the css contained in the example tutorial to the oscommerce stylesheet.

Step 4:
Add the jquery as per the example tutorial to all the pages in your site.

Step 5:
Open up the files /includes/boxes/categories.php and /includes/boxes/manufacturers.php and remove the tr and td tags. Also comment out the infoBoxHeading in both files as so;

[php]//new infoBoxHeading($info_box_contents, false, false);[/php]

Also, simply echo the strings at the end rather than place them in an infobox. As so;

[php]echo $manufacturers_list;[/php]

Step 5 is a bit complicated, but I can package something up if anyone is interested and there is a beer or two involved 😉

In the end it looks like this, obviously you would play with the .css to make it better suit the design of your site.

What I might do in my next makeover is use this method as it is a great way of saving space in a design.

Leave a Reply

Your email address will not be published. Required fields are marked *