## Magento Forum

Page 1 of 15
 LorenzoG   Total Posts:  36 Joined:  2007-09-02 Magento comes with a template there the customers select the right category from a horisontal menu. My question is if it’s possible to also have a vertical category menu (see attached picture) in a template. I think a vertical category menu is a must when you have very many categories, subcategories and items and that you want to show your possible customers which main/sub categories exists by default without that they need to pulldown a horisontal menu. My example is taken from pixmania.com and there they use a combination of horisontal menu (like Magento does now) and a vertical menu for to show the sub categories. I would love to see something similar in the Magento as well. I hope you understand what I mean. Else I’m happy to try to explain it in a better way. Image Attachments Click thumbnail to see full-size image Posted: September 27 2007    |  top
 Dan Orsborne   Total Posts:  72 Joined:  2007-09-20 There is already a .phtml file for a side navigation here: \app\design\frontend\OC\default\template\catalog\navigation\left.phtml By default this template will display the categories in a vertical list with the number of products in brackets beside the category name, BUT this only displays/works once you are below the top level of the site. It wouldn’t take much to edit this file to match the functionality you want to acheive. I would suggest making a copy of the left.phtml file and creating your own version called something different so your functionality doesn’t get over written when there is a new release. To use the left.phtml you need to do the following: Open app\design\frontend\OC\default\layout\catalog\initLayout.xml and add the following                                                Then open app\design\frontend\OC\default\layout\core\default.xml and add   Then you can add the following code snippet into your template file to display the menu where you want it:           getChildHtml('leftMenu')?>  Posted: September 28 2007    |  top  |  # 1
 LorenzoG   Total Posts:  36 Joined:  2007-09-02 Thanks Dan for taking your time and writting this I’ll take a look and play with it during the weekend. Posted: September 28 2007    |  top  |  # 2
 YoavKutner   Total Posts:  491 Joined:  2007-08-08 We are working on a new design package that should have this kind of functionality. In this design package, if you do not have an anchored category the sub categories of this category will be displayed in the left column. It will not drill down or open the sub category just display the immediate child categories. I hope this makes sense. Thanks yoav Posted: September 28 2007    |  top  |  # 3
 k9ert   Total Posts:  3 Joined:  2007-09-10 There seems to be some other XML files in the play. This tip only works for me, if i comment out a section in the file app\design\frontend\default\OC\layout\catalog\category\layered.xml                                                    It took me some time until i got the relations between the XML-Files, the Block-Code and the .phtml-Files. But i am still sometimes lost: - Why is this layered.xml file processed? Which are the general rules for processing the XML-Files? - What´s the meaning of this “before-attribute” Posted: October 1 2007    |  top  |  # 4
 seldon   Total Posts:  92 Joined:  2007-11-08 YoavKutner - 28 September 2007 11:28 AMWe are working on a new design package that should have this kind of functionality. In this design package, if you do not have an anchored category the sub categories of this category will be displayed in the left column. It will not drill down or open the sub category just display the immediate child categories. I hope this makes sense. Thanks yoav Im very interesting in a vertical menu as you describe. Is this design package already available? Seldon Posted: November 11 2007    |  top  |  # 5
 YoavKutner   Total Posts:  491 Joined:  2007-08-08 We should add more Magento design packages early next year. Thanks yoav Posted: November 12 2007    |  top  |  # 6
 seldon   Total Posts:  92 Joined:  2007-11-08 So, that currently means i should implement it myself Posted: November 12 2007    |  top  |  # 7
 Spek   Total Posts:  77 Joined:  2007-11-28 YoavKutner - 11 November 2007 10:06 PMWe should add more Magento design packages early next year. Thanks yoav I’m just wondering if this feature is available yet in the latest version? Or would a design package be a seperate download? If so, where? I haven’t run into any so far and I’m wondering if I’m missing something. I was able to cook up a basic working version but I would like to start with the added functionality you’ve mentioned. A quick overview of how I did this in 0.7.14800: cut the following from app/design/frontend/default/default/template/page/html/header.phtml  getChildHtml('topMenu')?>  paste it into app/design/frontend/default/default/template/page/3colums.phtml                  getChildHtml('store')?>                getChildHtml('left')?>                getChildHtml('topMenu')?>                                               in app/design/frontend/default/default/layout/page.xml move the following at around line 40:   to about line 47 (where the left block is):                That should do it, but you will notice that the CSS for the navigation is purely for a horizontal layout. Some quick changes you can make in app/skin/frontend/infinite/default/css/menu.css at about line 35 this:  #nav li { float:left; }  to his:  #nav li { float:none; }  This will put the categories below eachother. Remember though that I just made these changes real quick, not to be used in a live environment, so it doesn’t look good, and it might very well not work as expected. Subcategories for instance, are shown ontop of the other categories when you hover over a category with subcategories, and there’s something wrong with the z-index, making the subcategories appear below the center column, giving them a cut-off look. These problems shouldn’t be difficult to solve in the menu.css file. Posted: January 16 2008    |  top  |  # 8
 Pablo Lopez   Total Posts:  51 Joined:  2008-01-17 Hi there, I’m also trying to use a left sidebar for displaying the categories. I have Magento V. 0.7.14800 and the file structure you are talking about is kind of different. I don’t have either a app\design\frontend\XX\default\layout\catalog\initLayout.xml or app\design\frontend\XX\default\layout\core\default.xml what I did is I added this code to de /layout/catalog.xml on the default layout ( )                        then, on layout/page.xml I added this line (above the “left” block side):   and finally , I made the php call to output the block… (i did it on the 2colums-left.phtml )  getChildHtml('leftMenu')?>  But didn’t get any results So...any ideas what may be wrong? I don’t know if I understood correctly how I am supposed to call/reference/declare this boxes and then output them.... Posted: January 18 2008    |  top  |  # 9
 Spek   Total Posts:  77 Joined:  2007-11-28 Pablo Lopez - 18 January 2008 05:40 AM So...any ideas what may be wrong? I don’t know if I understood correctly how I am supposed to call/reference/declare this boxes and then output them.... Look at my post before yours for instructions with your version. It’s not very well done and needs some work but atleast the categories show up vertically in the left block. Posted: January 18 2008    |  top  |  # 10
 Pablo Lopez   Total Posts:  51 Joined:  2008-01-17 @ben - I see that you come around with a way to do the menu vertically, but is more a “hack” than the right way I try following the method posted in intro to layouts as I’m looking more into actually learning how to use magento than to only customize it. Thanks for your help anyway Posted: January 18 2008    |  top  |  # 11
 ad2joe   Total Posts:  60 Joined:  2007-08-31 Hello, Here’s my implementation of vertical categories menu: (note: see content that was added between and ) Step1. catalog.xml, around line 45            Step2. page.xml around line 47   Step3. in template/page/2columns-left.phtml (my case) around line 70      getChildHtml('leftMenu')?>    getChildHtml('left')?>   Step4. create a new file in template/catalog/navigation/ called left_menu.phtml with following content:  getStoreCategories(10);if($_main_categories->count()):?> __('My categories')?> getCategoryUrl($_main_category)?>"isCategoryActive($_main_category)):?> class="active">getName()?> _getChildCategories($_main_category, 10); ?>
1.                                   ->getCategoryUrl($_sub_category)?>"isCategoryActive($_sub_category)):?> class="active">getName()?>
2.

decorateDataList('narrow-by-list')              That should work. I just wanted to post it in case anyone is looking for something like this. You may add some style to it if you like, then share.  Thanks, Joe. Posted: January 21 2008    |  top  |  # 12
 ad2joe   Total Posts:  60 Joined:  2007-08-31 Hello, I also created a variation of the vertical category menu display, that will show a list of main categories, with a subcategories for only the active one, and without empty main categories:  getStoreCategories(10);$res=new Mage_Catalog_Model_Layer();if($_main_categories->count()):?>

__('My categories')?>

_getChildCategories($_main_category, 10); if($_sub_categories->count()): ?>
getCategoryUrl($_main_category)?>"isCategoryActive($_main_category)):?> class="active">getName()?>
getName()===$res->getCurrentCategory()->name ||$_main_category->entity_id===$res->getCurrentCategory()->parent_id): ?> 1. ->getCategoryUrl($_sub_category)?>"isCategoryActive(\$_sub_category)):?> class="active">getName()?>
2.

decorateDataList('narrow-by-list')              Thanks, Joe. Posted: January 21 2008    |  top  |  # 13
 Pablo Lopez   Total Posts:  51 Joined:  2008-01-17 Exelent joe!! Works great. I will like to add a couple of things to take in advice: disable magento’s cache when workin’ with layouts. I wasted a bunch of time trying to figure out what’s wrong until I read a couple of post that explained this . You should do that on de admin, over system-> cache management or something like that- The other thing is that you should disable the layered navigation when browsing categories, and show the left navigation ; cos it will overlap with the vertical menu you just created, and will show only the subcategories of the category you are currently browsing. This is in case you want to always show all categories                                                                                                                 note that is on the catalog_category_default handle , not in the handle. Posted: January 22 2008    |  top  |  # 14
 andrewmaier   Total Posts:  22 Joined:  2008-01-13 Hey guys, I’m trying to get this to work on my front page. Any idea why it wouldn’t work? I even created a test category and added an item to it. :shrugs: Very frustrated with magento at the moment. Although, I know it’s my fault. -A Posted: January 25 2008    |  top  |  # 15
 Page 1 of 15 < Prev123Next >Last »