The Dropdown Menu allows you to create a structured, expandable menu in the header area.
You can manage its settings from:
Appearance → Customize → Header → Dropdown Menu
This feature is commonly used to display categories, pages, or custom navigation structures in a more organized way.
General Settings #
- Title – The label of the dropdown trigger (e.g., “All Categories”).
- Menu Width – Set the width of the dropdown menu (in pixels).
- Typography – Customize font styles for menu items.
- Menu Item Gap – Spacing between menu items (in pixels).
- Menu Icon Size – Size of icons used in the menu (in pixels).
- Menu Arrow Size – Size of submenu arrows (in pixels).
- Menu Padding Inline – Left and right padding (in pixels).
- Menu Padding Block – Top and bottom padding (in pixels).
- Submenu Padding – Padding inside submenus (in pixels).
Title Design #
You can enable and customize the dropdown title design using the following options:
- Enable Title Design – Turn on this setting if you want to customize the design of the dropdown menu item.
- Custom Title Color – Choose a text color.
- Title Background – Choose a background color.
- Title Padding – Top, Left, Bottom, Right (in pixels)
- Title Border Width – Individual border widths (top, right, bottom, left)
- Title Border Style – Solid, etc.
- Title Border Color – Choose a border color.
- Title Radius – Border radius for each corner (in pixels)
Menu Content #
- Menu – Enable or disable the menu.
- Before Text – Add content before the menu (text, media, or HTML).
- After Text – Add content after the menu (text, media, or HTML).
This allows you to enrich your dropdown menu with banners, images, promotional text, or additional information.
To display menu items inside the dropdown, you need to assign a menu to the following location:
Appearance → Menus → Dropdown Menu
Enable in Header #
After configuring the dropdown menu, you need to enable it in the header settings:
Appearance → Customize → Header → Header General
- Dropdown Menu – Enable or disable the dropdown menu.
Tip: Use the Dropdown Menu to highlight product categories, featured collections, or important navigation links for better user experience.
