Header Design
Choose from Classic, Closed, Titles, or Vertical header layouts, each offering unique styling and menu options.
The Header Design chapter explains the different layout styles available for your store’s header and main navigation. Each design offers unique structural and visual options to match your brand’s look and usability goals.
You can choose between Classic, Closed, Titles, or Vertical menu styles — each with its own set of customizable features such as badges, contact information, icons, and top bars. These layouts define how your navigation, links, and header elements are displayed across your store.
Classic Menu
The Classic Menu layout offers a traditional, horizontal navigation bar — perfect for stores that prefer a familiar and easy-to-navigate design.
Includes:
Badges – Add small labels (e.g., New, Sale, Hot) to highlight specific menu items or categories.
Mega Menu – Expand your dropdown menus into larger panels with multiple columns, images, and links. Ideal for stores with many product categories.
Top Bar – A slim bar above the header for extra content such as contact info, login links, or language/currency selectors.
Purpose: To create a classic and well-balanced header suitable for a wide range of store types.
Closed Menu
The Closed Menu layout uses a compact, toggle-based navigation (often a hamburger icon). This design is ideal for minimalist or mobile-focused stores.
Includes:
Badges – Highlight specific menu items or collections with visual tags.
Contact Information – Display essential details like your phone number, email, or store address.
Menu Images – Add small images or thumbnails to menu links for a more visual browsing experience.
Top Bar – An optional section for announcements, shortcuts, or additional links.
Purpose: To provide a clean and space-saving navigation layout that keeps the header simple and modern.
Titles Menu
The Titles Menu layout emphasizes text-based navigation with clean typography and minimal design elements. It’s ideal for brands focusing on simplicity and clarity.
Includes:
Contact Information – Show your business or customer service details directly in the header.
Main Menu Icons – Add icons beside main menu links for improved readability and style.
Mega Menu – Enhance dropdowns with structured layouts and images when displaying larger product ranges.
Top Bar – A customizable section for secondary information or links.
Purpose: To create a straightforward, typography-driven header with a focus on clarity and brand identity.
Vertical Menu
The Vertical Menu layout places navigation along the side of the page rather than at the top, offering a distinctive look and extra space for content-rich menus.
Includes:
Contact Information – Add store address, email, or phone details for quick access.
Main Menu – Display your navigation links vertically along the sidebar.
Items – Adjust the order and style of individual menu items to fit your layout.
Top Bar – Optional section at the top for extra details or quick links.
Purpose: To deliver a modern, sidebar-style navigation that stands out and supports content-heavy or creative store layouts.
Last updated