Navigation menu and custom pages
Set up the tab bar, the sidebar menu and the header icons, and add your own pages, such as About us or a sale landing page.
Your app has two kinds of navigation: the tab bar along the bottom and the sidebar menu that opens from the header. You can also build your own pages and link to them from anywhere in the app.
Open Navigation to edit the tab bar and menu. Click Save when you’re done. Your changes go live after you publish in Design Studio.
The tab bar
Your app has 2 to 5 tabs. Short, one-word labels read best on small phones.
- Add tab adds a tab. Use the arrows to reorder tabs, and Remove to delete one.
- For each tab, set a Label (up to 16 characters), an Icon (search 176 icons) and what it Opens: Home, All collections, A collection, A product, Search, Cart, Wishlist, Account, a web link, or a page you built.
- Navigation style sets the look: Bottom tabs, Floating pill or Minimal tabs. Show tab labels turns the text under the icons on or off.
The sidebar menu
On the Navigation page, the sidebar menu is called Drawer menu.
- Add menu item adds a link, and Add sub-item adds one level below it. You can have up to 40 items, each with up to 30 sub-items.
- To start from your store’s menu, pick a Shopify menu and choose Import menu. Links to Shopify pages, blogs and policies are skipped, because the app can’t open them yet.
The menu opens from the menu button in your app’s header.
Header icons
In Design Studio, select Header to choose the icons in your app’s header: search, wishlist, notifications and cart. Turn on Menu button to open the sidebar menu. It needs at least one menu item in Navigation.
Tip: The wishlist is included in Growth and up. On other plans, the app hides it even if it’s selected.
Add your own page
Custom pages are built from sections, like your home page. Use them for an About page, a sale landing page or a collection showcase.
- In Design Studio, open the page picker in the top bar and choose Add a page.
- Enter a Page title and choose a starting layout: Blank page, About us, Campaign landing page or Collection showcase.
- Click Create page, then add and edit sections as usual.
Each page has an address starting with /page/. If you change it, every link to the page in your app is updated. You can have up to 20 pages in each theme.
Link to your page
Anywhere you choose what a tab, menu item, banner or button opens, pick A page you built and select your page.
If you delete a page, links to it open the home page instead. You can bring it back from version history in Theme Library.
Did this answer your question?
Great. Thanks for reading.
Sorry it didn’t. Tell us what’s missing and we’ll answer you and improve the guide.