Skip to main content

Unified Navigation (Wishlist + Saved for Later)

Show your Wishlist and Saved for Later in a single popup with two tabs, so shoppers can switch between them without closing the window.

Written by Kris James

Unified Navigation puts your Wishlist and Saved for Later together in a single popup split between two tabs. Shoppers can switch between their wishlisted items and their saved-for-later items without closing the window.

When it's off, the two surfaces stay independent. The Wishlist popup and Saved for later popup need to be opened individually.

Unified Navigation only shows the tabs when both Wishlist and Saved for Later are enabled. If you only use one of the two features, the popup will look the same as before, with no tabs.


What it looks like for customers

When Unified Navigation is on, a tab strip appears at the top of the popup. The strip has two tabs:

  • My Wishlist

  • Saved for later

Each tab shows the number of items in that list next to its label, in a slightly muted style. For example: My Wishlist 4 and Saved for later 2. This gives shoppers a quick read of what's where without having to open each tab.

Shoppers navigate between the two views by clicking each individual tab. The popup stays open the whole time.


How to turn it on

  1. From your Shopify admin, open the Mage Loyalty app.

  2. In the left menu, click Wishlist, then Saved for later.

  3. Click Customise to open the Saved for Later builder.

  4. At the top of the General tab, turn on the Unified Navigation toggle.

  5. Click Save.

Unified Navigation is a shared setting. Turning it on from the Saved for Later builder also turns it on for the Wishlist popup, and vice versa.


Customising the tab labels

The two tab labels are not edited in one place. Each label comes from the builder of its own surface:

Tab

Where to edit the label

My Wishlist

Wishlist builder → General tab → Dialog title

Saved for later

Saved for Later builder → Pages tab → Saved for later page state → Saved for later tab label

After editing a label, click Save in that builder and reload your storefront to see the change.


Item counts in tabs

The number shown next to each label is the count of items currently saved in that list for the logged-in customer. The count updates in real time as the shopper adds or removes items.


Tips

  • Unified Navigation works for both the Wishlist trigger (#mage-wishlist) and the Saved for Later trigger (#mage-saved-for-later). Whichever link a shopper clicks, the popup opens on the matching tab.

  • If a shopper switches tabs and then closes the popup, the popup will reopen on whichever tab they last looked at.

  • The tab strip uses your existing colours and radius from the Design tab of either builder. You don't need to style it separately.


Troubleshooting

I turned Unified Navigation on, but the tabs are not appearing.

  • Confirm both Wishlist and Saved for Later are enabled. If either one is off, the tabs are hidden by design.

  • Hard refresh your storefront (Cmd+Shift+R on Mac, Ctrl+Shift+R on Windows) to clear any cached version of the popup.

  • Check that the Mage Loyalty app embed is enabled on your live theme.

The tab labels show the wrong text. Each label comes from a different builder, see the table above. Edit each label in its own builder and save.

I want to hide the item counts. Removing the counts is possible with custom CSS, simply hide the class.


Need help?

If something looks off after turning Unified Navigation on, reach out to our team and we'll take a look.

Did this answer your question?