Wishlist buttons, drawer, and the wishlist page
Configure every storefront element: the button, card hearts, header icon, slide-out drawer, and the dedicated wishlist page with tabs.
5 steps · about 8 minutes
Style the wishlist button
In the theme editor, select the Wishlist Button block on your product template. You control display style (full button or compact icon), label text, icon, colors for both saved and unsaved states, size, alignment, and position relative to Add to cart. There is also a custom CSS box for anything bespoke.
Card hearts and header icon
Open App embeds → Simpll Wishlist settings. Here you set the heart position on product cards (top left or top right), heart colors for saved and unsaved states, and where the header icon appears. The header icon always shows a live badge with the number of saved items.
Choose drawer or page
In the app, go to Settings. Under Wishlist view, pick what the header icon opens: the slide-out drawer (quick access, subtotal footer, add-all-to-cart) or a dedicated page.
Set up the dedicated wishlist page
Create a new page in Shopify (Content → Pages), e.g. "Wishlist". In the theme editor, open that page's template and add the Wishlist Page app block. Then paste the page URL into the app's Settings. The page renders three tabs (Wishlist, Saved for Later, Recently Viewed), a share-link bar, rename, and a sticky add-all-to-cart bar on mobile. Design options (margins, card style, columns, sticky bar on/off) live in the block settings and inherit your theme's fonts and colors automatically.
Sharing
Shoppers can copy a share link from the wishlist page. Anyone opening the link sees a live view of that list, no login needed. Share links power the referral rewards feature later on.