Mobile dock

Give mobile shoppers an app-style navigation bar at the bottom of the screen with quick access to your cart, search, menu, account and key pages.

---

Pro feature. This section requires a Pro or Max License key. Without one, it's hidden on your live store and shows a 🔒 Pro notice in the theme editor. Learn about plans and License keys

The Mobile dock is a navigation bar fixed to the bottom of the screen on phones, like the tab bar in a shopping app. Each item is an icon with a label: cart, search, menu, account, or a link to any page. It only shows on mobile and lives in the Overlay group, so it appears on every page.

The dock appears once shoppers scroll past the header. While it's showing, the theme hides the sticky header so the two don't both cover the page.

1. Our guide to set up a Mobile dock section:

Steps:

• In the theme editor, click Add section in the Overlay group at the bottom of the sidebar.

• Locate Mobile dock.

• Switch the preview to mobile view with the phone icon at the top of the editor. The dock doesn't show on desktop.

• Click Save.

The section is added with two Link blocks, a Cart, a Search and a Menu block. Drag the blocks to reorder them.

2. Section settings

• General

  • Behavior: When the dock is shown: On scroll up / Always.

    • On scroll up: The dock slides in when shoppers scroll up and hides when they scroll down.

    • Always: The dock stays on screen once shoppers scroll past the header.

  • Color scheme: None / Accent 1 / Accent 2 / Background 1 / Background 2 / Inverse. None keeps the page's default colors.

• Section padding

  • Top padding and Bottom padding: 0–40px.

3. Block settings

You can add up to 6 blocks in total. Cart, Account, Search and Menu can each be added once.

Cart block

• Cart style: The icon: Cart / Bag.

It shows the number of items in the cart. It opens the cart drawer when Cart type is set to Drawer in Cart theme settings; otherwise it goes to the cart page.

Account block

No settings. It shows Log in for guests and Account for signed-in customers, and links to the matching page.

Search block

No settings. It opens the Search modal.

Menu block

No settings. It opens the mobile menu from your Header.

Link block

• Icon: Choose from 31 icons, such as Store, Heart, Price tag or Truck.

• Label: The text below the icon.

• Link: The page, collection, product or URL it opens.

4. Tips

• Four or five items fit best on small phones. Keep labels to one short word.

• Use a Link block with the Store icon and your home page as the first item, so shoppers can always get back to the start.

• If you also use the Live reel, it sits just above the dock so the two don't overlap.