The easy way to build a wishlist in a Shopify theme is to keep it in the browser's local storage. It takes an afternoon, and it breaks the first time a shopper switches from phone to laptop, clears their browser or simply comes back on a different device. For Chrüterhüsli, a Swiss drugstore and natural products retailer on Shopify's Horizon theme, I built it the other way.

The list lives on the server

Instead of browser storage, the theme talks to a Shopify app proxy. An app proxy lets the storefront call an app's backend through a URL on the store's own domain, so the request carries the shop context and the list is held server side.

The API is deliberately small, one endpoint per action:

  • add an item,
  • fetch the list,
  • remove one item,
  • clear the whole list.

Separate endpoints keep each action simple to test and simple to reason about when something goes wrong.

A button that does not lie

The subtle part is the heart button on each product. If it only remembers what the shopper clicked during this page view, a saved product shows as unsaved after a reload, and the shopper clicks it again. So on load, the button reconciles its state against the server: a product that is saved reads as saved, on any page, after any reload.

Translatable from the first line

Chrüterhüsli sells in German and English, so every string the wishlist shows comes from the theme's locale files, with English fallbacks. Adding a language later means adding translations, not hunting through JavaScript for hard-coded text.

The rest of the build

Around the wishlist I worked on the contact page with its form and confirmation flow, promotional image blocks on the collection page with their own tablet layout, the filter and results-count header, product card alignment, the blog list and article layouts, product page breadcrumbs and spacing, and the German and English translations.

When browser storage is still fine

For a "recently viewed" strip, local storage is the right tool: nobody expects it to follow them. A wishlist is different. People use it to plan a purchase across days and devices, and a list that quietly disappears is worse than no list at all.

Further reading