Mobile navigation bar 🔥
Help users navigate effortlessly on limited mobile screens with an intuitive Mobile navigation bar
The Mobile navigation bar section is a fixed navigation menu that remains visible at the bottom of the mobile screen as the users scroll up/down.
A navigation bar helps your users navigate through your website with ease on limited mobile screens. It is different from the sticky header that appears on the top.
In this article, we will show you how to set up a Mobile navigation bar section.
How to access the Mobile navigation bar section settings
Steps:
In the theme editor (Customize), click Mobile navigation bar.
Edit the settings.
Save the settings.
How to edit the Mobile navigation bar section
Section settings
Check the Enable mobile sticky bar box to show the sticky navigation bar on mobile to let customers shopping easier by ensuring it remains visible as users scroll through the page.
The Show button label is checked, making the label text (like "Home" or "Cart") visible below each icon for better clarity.
Block settings
This section has 4 pre-built blocks: Home, Products, Search, and Cart (each can only be added once).
You can add a maximum of 6 blocks, including 2 Custom link blocks.
Moreover, you have the flexibility to show or hide individual blocks based on your store's specific objectives.
Home: Get back to the home page (You can change the label text for this block).
Search: Open the search drawer and let customers search for products (You can change the label text for this block).
Cart: Open the cart drawer and let customers check the items they have added or check out (You can change the label text for this block).
Products: Redirect customers to the specific collection page (You can change the label text for this block).
If there is no collection selected, the button will be linked to "All" collection.
Custom link: Redirect customers to an attached link page as desired.
In the custom link block, you can edit three elements:
Title: Fill in the title of the section you want to add to the mobile navigation menu (this will be shown as the button label).
Link: Paste a link or choose the section you want to add to the mobile navigation menu.
Icon: Choose your favorite icon.
Last updated