Main Menu

The Main Menu is a very advanced menu building module. It supports simple multi-level categories dropdowns as well as robust and feature rich mega menu dropdowns with page builder support.

See example and below explanations.

  1. Create one or more Main Menu modules in Journal > Header > Main Menu.
    1. Menu Item Name seen in the admin. Use the vertical dots icon on the left to drag menus and change sort order.
      • 1b. Style Override. By default the main menu module uses the Menu Item Style applied in the header module, but you may style each menu differently than the others here.
      • 2b. Menu Label. Each main menu item can have a custom label applied from here. The label uses the Menu Label style from Journal > Styles > Menu Label so make sure to create some styles first.
    2. Menu item status. You may create conditional menu items that only appear on specific devices or users (guests, customers, customer groups, etc.) See example 1 / See example 2

    3. Menu title seen in the storefront.
    4. Optional custom icon.
    5. Hides menu text and displays the icon only.
    6. The link where the menu item should navigate.
    7. The menu dropdown type
      • 7a. Dropdown - displays normal dropdown or multi-level subcategories. See subcategory example

      • 7b. Flyout. Create the Flyout module separately in Journal > Modules > Flyout Menu.
      • 7c. Mega Menu. The mega menu uses the layout page builder. For category links the best module is the Catalog module found in Journal > Modules > Catalog, but any other compatible module may be used.
      • 7d None. Choose this option for simple menu items that don’t require any dropdown.
    8. Dropdown menus or modules, based on the dropdown type.
  2. Assign the menu module to the active header in Journal > Header > Active Header > Main Menu > Menu Module. You can see which header is active in Journal > Skins > Header > Desktop Header.
  3. Apply Menu Style. Styles for the menus are created in Journal > Styles > Menu Item. You may create unlimited styles and activate each one in different headers. Additionally, each menu item can be styled differently directly from the Main Menu module.
  4. Activate various other options available for the main menu in each header.

The Classic header can display two different menu modules. This is useful when you want to have some menu items on the left and others on the right. See example