Intenso

The main menu located on the header can display drop-downs in two styles: Classic Menu and Mega Menu.

Classic Menu

The classic menu is a standard drop-down menu which can display up to 5 category levels.

To limit the number of category levels displayed on the classic menu, navigate to System > Configuration > Catalog click the Category Top Navigation tab to expand it and enter the number of category levels in the field Maximal Depth.

To set a category menu drop-down as Classic, do the following:

1. In the Admin menu, select Catalog > Manage Categories.
2. On the left pane, click on the name of the top-level category you want to set up.
3. Click the Menu tab.
4. Set Menu Style to classic.
5. Click the Save Category button.
   

Mega Menu

With the Mega Menu extension you can create beautiful and responsive mega-menu layouts which can display 3 levels of categories, custom HTML and images. Categories and subcategories are automatically populated and you can add right, top and bottom blocks with any content you like.

You can also create mega-menus based on static blocks, so you have absolute freedom about the content and style. There are two different sets of configurations: one for top-level categories and other for subcategories.

To set a top-level category menu to display as Mega Menu, do the following:

1. In the Admin menu, select Catalog > Manage Categories.
2. On the left pane, click on the name of the parent category you want to set up.
3. Click the Menu tab.
4. Set Menu Style to Mega-Menu.
5. Set Number of Columns on Large Screens and Number of Columns on Medium Screens fields to the number of columns that fit your design.
6. Click the Save Category button.
   

Adding Custom Blocks to Top-level Categories

Top-level categories can have 3 custom blocks per menu:

1. Top Block
2. Bottom Block
3. Right Block

To add custom blocks to a top-level category do the following:

• In the Admin menu, select Catalog > Manage Categories.
• On the left pane, click on the name of the top-level category you want to set up.
• Click the Menu tab.
• Enter the HTML code of the Blocks you want to add to your menu. If you add a Right Block, don't forget to specify its width on the Width of the Right Block field.

  <!-- Example code for a Right Block -->
  <img src="{{media url='theme/mega-menu-women.jpg'}}" alt="Women" style="width: 100%; position: absolute; bottom: 0;">

  <!-- Example code for a Top Block -->
  <a href="#">Casual Looks
  <a href="#">Sportwear</a>
  <a href="#">Workwear</a>
  <a href="#">Sport-Inspired Layers</a>
  <a href="#">Dress Shop</a>
  <a href="#">Other Custom Link</a>

  <!-- Example code for a Bottom Block -->
  <a href="#" style="color: #27ccc0 !important; text-decoration: underline;">30% OFF on all Jeans - Just use discount code <strong>30%OFF</strong> at checkout</a>

• Click the Save Category button.

Adding Custom Blocks to Subcategories

Subcategories can have 2 custom blocks:

1. Top Block
2. Bottom Block

 To add custom blocks to a subcategory do the following:

• In the Admin menu, select Catalog > Manage Categories.
• On the left pane, click on the name of the sub category you want to set up.
• Click the Menu tab.
• Enter the HTML code for the Top Block and/or Bottom Block. 

  <!-- Example code for a Top Block -->
  <a href="{{store direct_url="electronics/tablets.html"}}"><img src="{{media url='theme/mega-menu-electronics-tablets.jpg'}}" alt="Tablets" style="width: 95%;"></a>

• Click the Save Category button.

Vertical Mega Menu

If you have many first-level categories in your store you can take advantage of the Vertical Mega Menu. This menu works like the classic menu and Mega Menu, but the options are presented in a vertical fashion, so you can accommodate more categories.

To enable Vertical Menu please follow this steps:

1. In the Admin panel, navigate to System > Configuration
2. On the left pane, click on Theme Setup
3. Click the Header tab to expand it
4. Set Main Menu Style to Vertical
5. Click the Save Config button