All Collections
Look and Feel
Managing Navigation Elements (X-Cart 5.5.x)
Adding Categories to Your Store's Primary Menu (X-Cart 5.5.x)
Adding Categories to Your Store's Primary Menu (X-Cart 5.5.x)

Learn how to move your product categories from the categories block to the top menu

Seller Labs avatar
Written by Seller Labs
Updated over a week ago

It is possible to change the representation of categories on your store site so the categories are displayed horizontally as a part of your store's Primary menu.

Since your categories will be shown on the Primary menu, you will probably want to keep the regular categories block out of the way. You can hide the categories block using the Storefront Builder.

To add your categories as menu items to your store's Primary menu:

  1. Go to the Menus & Pages page of your store's Admin area (Store Design > Menus & Pages) and switch to the Primary Menu tab.

  2. Add your categories to the Primary menu as menu items.

    For the sake of example, let us create menu items for the categories Fashion, Beauty & Health and Electronics.

    First, click New Item:

    This provides you with a blank new line.

    You can use this line to enter information about any menu item you prefer to create first; for example, Fashion. Or you can click the New item button a couple more times to add more blank lines; this will allow you to add multiple menu items and save them with a single click. Since you need to add three menu items (Fashion, Beauty & Health and Electronics), the latter method may be more convenient. So click New item two more times to add two more blank lines.

    Use the blank lines to provide all the required information (name, link, accessibility level) for each of your menu items (Fashion, Beauty & Health and Electronics).

    The links to the category pages in question can be specified in the Link field using one of the following methods:

    Once you are done, click Save changes.

    This applies your changes and adds the menu items for the categories Fashion, Beauty & Health and Electronics to the Primary menu.

  3. Make sure the menu items for your categories are enabled: the On/Off switch elements before their names should be set to the On state (green color) . This way they will be visible on the Primary menu.

    After adding categories to your Primary menu, you may find the Primary menu navigation panel is getting overcrowded. Consider removing/hiding from the Primary menu any menu items that you do not need. You can do so by disabling the respective menu items: simply set the On/Off switch for each item you no longer want on the menu to the Off state (grey color).

  4. Make sure the menu items for your categories stand in the order you want them to appear on the menu. The order of the menu items on the Primary menu navigation panel is determined based on the order of the items on the Primary Menu tab on the Menus & Pages page. You can use the four-headed arrow control elements to rearrange the order at any time by dragging and dropping the items to their new positions.

    For example, if we want the menu item Home to go before the menu item Fashion on the Primary menu navigation panel, we will need to drag-n-drop the menu item Home like this:

  5. If your categories have nested categories (subcategories) and you want them to also appear on the Primary menu, add those categories as submenu items. At each level, you can add as many submenu items as you require. Also, for any item it is possible to add a submenu.

    For the sake of example, let us add the subcategories Clothing, Shoes and Accessories as menu items at the level of submenu for the category Fashion.

    First, locate the menu item Fashion and click on the Add link in the “Submenu” column opposite its name.

    On the page that opens, click New item.

    This provides you with a blank new line.

    You can use this line to enter information about any menu item you prefer to create at this level first; for example, Clothing. Or you can click the New item button a couple more times to add more blank lines; this will allow you to add multiple menu items and save them with a single click. Since you need to add three menu items (Clothing, Shoes and Accessories), the latter method may be more convenient. So click New item two more times to add two more blank lines.

    Use the blank lines to provide all the required information (name, link, accessibility level) for each of the submenu items (Clothing, Shoes and Accessories). Once you are done, click Save changes.

    This applies your changes and adds all the three submenu items to the Primary menu:

    Make sure the submenu items you have added are enabled and stand in the order you want them to appear on the Primary menu. If not, make the necessary adjustments and save the changes again.

  6. Check your new site layout.


It is also possible to move the categories list to the horizontal bar using X-Cart's add-on Horizontal Flyout Categories Menu. It may be easier in terms of setup.


Related pages:

Did this answer your question?