Collection list
In the header, start by creating the main menu that serves as the primary navigation for your store. Once the main menu is established, you can add a mega menu with various layouts and designs to specific items within the main menu. This allows you to organize and display detailed submenus, enhancing navigation and user experience. Follow to the header settings article to check screenshot of main menu.
Setting | Description |
Item name | Specify the name of the navigation menu you want to connect to the collection's menu view. Refer to the screenshot below for guidance. |
Menu | Create Menu in the Content Tab on admin panel Navigate to the Content Tab and select Menus to create a new menu or edit an existing one. Then choose the collection's menu from the list to display in the header. |
Button label | Decide whether the menu includes a button:
|
Button link | Add a URL or page link for the button, directing customers to a specific destination. |
Button style | Choose the button’s appearance:
|
Color scheme | A color scheme consists of a predefined set of colors you can apply to this section for consistent styling. These schemes are created in the Theme Settings and are available across all sections, making customization faster and ensuring a cohesive color system throughout your store. Learn more about color schemes. |
Collections menu — Collection list
To replicate the structure shown in our demo store, you need to create two menus:
Header Main Menu:
This is the primary navigation menu displayed in the header and used across all views, including mobile.
Collections Menu:
This menu is specifically for the Collections List Menu Block.
Why Two Menus?
We created a second menu because it’s not possible to create 4-level menus within a single menu structure. On our demo store, the second menu was created for the “All Collections” category.
Setup Details:
- The “All Collections” category should include the same subcategories, products, and links as the Collections Menu in the Header Main Menu.
- This ensures a consistent view for desktop and mobile.
Mobile View Note:
For mobile, only the Header Main Menu is displayed. Therefore, it’s crucial to have the correct links and structure in the Header Main Menu to mirror the Collections Menu for a seamless user experience.
Banner
Setting | Description |
Color scheme | A color scheme consists of a predefined set of colors you can apply to this section for consistent styling. These schemes are created in the Theme Settings and are available across all sections, making customization faster and ensuring a cohesive color system throughout your store. Learn more about color schemes. |
Banner background | Add a banner image to highlight important offers in the header or to showcase featured collections, for example. |
Button label | Decide whether the menu includes a button:
|
Button link | Add a URL or page link for the button, directing customers to a specific destination. |