Sleek
Try Sleek freeResourcesOther solutions
  • What is Sleek theme
  • Changelog
  • Refund policy
  • Support policy
  • Getting started
    • Install Sleek theme
    • Set up my store as Sleek demo
    • Update Sleek theme
    • Theme license & Transfer
  • BUILD FOR SUCCESS SERIES
    • Homepage for Health & Beauty 🔥
  • Page's global sections
    • General settings
    • Announcement bar
    • Cart drawer
    • Header
      • Mega menu
      • Use Country/ Region selector
      • Use Language selector
    • Footer
    • Mobile navigation bar
    • Pop-up
    • Quick view
  • Theme sections
    • Before/ After image slider
    • Blog post
    • Card images
    • Collage tabs
    • Collapsible tabs
    • Collection image showcase
    • Collection list
    • Collections showcase
    • Collections slider
    • Contact form
    • Countdown timer
    • Custom content
    • Custom liquid
    • Email signup
    • Favorite products
    • Feature list
    • Featured product
    • Featured collection
    • Featured products tab
    • Highlight text with image
    • Image gallery
    • Image with text
    • Image with text columns
    • Image with text overlay
    • Layered images with text
    • Lookbook banner
    • Lookbook cards
    • Lookbook slider
    • Media with collection
    • Multicolumn
    • Press
    • Products bundle
    • Product tabs
    • Product showcase
    • Recently viewed products
    • Rich text
    • Scrolling promotion
    • Slideshow
    • Store locator
    • Testimonials
    • Video
    • Video hero
    • Video with text
  • Theme settings
    • General 🔥
    • Animations
    • Buttons
    • Custom CSS
    • Blog cards
    • Cart
    • Collection cards
    • Color swatches
    • Colors
    • Currency format
    • Layout
    • Logo
    • Product cards
    • Search behavior
    • Social media
    • Typography
  • Collections & Products
    • Product page
      • Product template
      • Page sections
        • Breadcrumbs
        • Product information
        • Related products
        • Sticky add to cart bar 🔥
    • Collection page
      • Collection template
      • Collection sections
        • Collection banner
        • Product grid
    • Collections list page
  • Other pages
    • 404 page
    • Blogs
    • Blog posts
    • Cart
    • Password
    • Search page
  • FAQs
    • Generic
      • Add gift wrap option to my cart
      • Combined listings app
      • How to add custom fonts in Sleek? 🔥
      • JavaScript events for developers
    • Product
      • Set up quantity rules and volume pricing 🔥
      • Add custom badges using product tags
      • Set up Local Pickup option
      • Show dynamic content for Products using Metafields 🔥
Powered by GitBook
On this page
  • How to access the Mobile navigation bar section settings
  • How to edit the Mobile navigation bar section
  • Section settings
  • Block settings
  1. Page's global sections

Mobile navigation bar

Help users navigate effortlessly on limited mobile screens with an intuitive Mobile navigation bar

PreviousFooterNextPop-up

Last updated 7 months ago

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:

  1. In the theme editor (Customize), click Mobile navigation bar.

  2. Edit the settings.

  3. 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:

  1. 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).

  2. Link: Paste a link or choose the section you want to add to the mobile navigation menu.

  3. Icon: Choose your favorite icon.

The Mobile navigation bar feature is available on Sleek version 1.4.0 and above

See .

✨
✨
Changelog
Try Foxify free now