Navigation
Navigation elements in Foxify help your customers move through your store easily, whether on desktop or mobile.
Check out our pre-designed sections of Header for quick setup and inspiration. 💖
👀 Learn more: Add a Section
Menu
The Menu element lets you display a horizontal or vertical navigation bar on your storefront. It's the main structure for showing key site links like “Home,” “Catalog,” or “About.”
How to add a Menu element
Steps:
In the FoxStudio editor, on the left Sidebar > Click Add elements, or press E.
In Advanced elements, select Navigation.
Drag the Menu element onto your canvas.
Make necessary changes.
How to edit a Menu element
Steps:
Select the element in the editor.
All the formatting tools for the element can be found in the Inspector panel.
Main menu
Select a menu from your Shopify admin > Content > Menus to display.
Direction
Set to display your menu items horizontally or vertically.
Show nested items: Enable to show nested menu items on dropdowns when hovering.
Design
Decide what you want to design:
Element container
Desktop dropdown
Menu opener
The Menu opener is a compact mobile-friendly navigation element that replaces the standard menu on smaller screens. It displays a hamburger icon which, when tapped, reveals the menu as a drawer.
Steps:
In the FoxStudio editor, on the left Sidebar > Click Add elements, or press E.
In Advanced elements, select Navigation.
Drag the Menu opener element onto your canvas.
Make necessary changes.
Country/Language selector
Allow shoppers to view your site in their local language and currency with the Country/Language selector.
How to add a Country/Language selector element
Steps:
In the FoxStudio editor, on the left Sidebar > Click Add elements, or press E.
In Advanced elements, select Navigation.
Drag the Country/language selector element onto your canvas.
Make necessary changes.
How to edit a Country/Language selector element
Steps:
Select the element in the editor.
All the formatting tools for the element can be found in the Inspector panel.
Selector type: Select what you want to show to customers:
Country/region selector
Language selector
To manage your store's regions, check out Shopify Markets:
You can choose to display the currency code and/or flag in your selector.
Cart link
Add a cart icon to your header. It optionally shows the number of items in the cart and links to either the cart drawer or the cart page.
How to add a Cart link
Steps:
In the FoxStudio editor, on the left Sidebar > Click Add elements, or press E.
In Advanced elements, select Navigation.
Drag the Cart link element onto your canvas.
Make necessary changes.
How to edit the Cart link element
Steps:
Select the element in the editor.
All the formatting tools for the element can be found in the Inspector panel.
Icon: Choose your preferred Cart icon style.
Toggle Show cart count if you want to display item quantity.
Select the Cart action:
Open cart drawer
Open cart page
Last updated
Was this helpful?