Skip to main content

How to Customize Your Wishlist: Side Drawer or Separate Page

Show the My Wishlist surface as a side drawer or a separate page, and customize its title, content, and style.

How to Customize Your Wishlist: Side Drawer or Separate Page

The My Wishlist surface is where a customer sees the items they've saved. You can show it as a side drawer that slides in over the store, or as a separate page on your storefront. You can customize the title, position, content, and styling of either one to match your store's branding.

Where to Access the Customization Panel

  1. Log in to Shopify Admin.

  2. Open the Notify Me! app.

    • In your Shopify sidebar, go to Apps > Notify Me!

  3. Access Widget Customization.

    • In the Notify Me! dashboard, select Wishlist from the left-hand menu.

    • Click Customize appearance in the banner at the top.

  4. Select the My Wishlist widget.

    • Under the Widgets section, choose My Wishlist to begin customizing.

Choose how the wishlist appears: drawer or separate page

At the top of the My Wishlist widget you'll see a My Wishlist type choice:

  • Side drawer — the wishlist slides in as a side panel over your store. This is the default.

  • Separate page — the wishlist opens as its own page on your storefront.

When you pick Separate page, the page is created automatically — there are no theme-editor steps. The customization panel switches to show the page's settings.

Separate page is part of the Wishlist page plan feature. If your current plan doesn't include it, the option is locked — selecting it opens an upgrade prompt for the Wishlist page feature, and the wishlist keeps showing as the side drawer until you upgrade.

The first time you switch to Separate page, your store asks you to allow Notify Me! to create and manage online store pages. Approve it so the wishlist page can be created — if you decline, the wishlist stays as the side drawer.

Customize Drawer Content and Layout

These settings apply when My Wishlist type is set to Side drawer.

You can update the layout and wording inside the drawer:

Drawer Title

  • Change the header (default: "Wishlist").

Drawer Position

  • Choose which side the drawer slides from: Left or Right.

Content Settings

If Wishlist Has Items (Non-empty State)

  • All to Cart Button Label: Text for the "add all items to cart" button.

  • Add to Cart Button Label: Text for each item's individual add button.

  • Out of Stock Button Label: Text for items that are unavailable.

If Wishlist Is Empty (Empty State)

  • Empty List Description: Message shown when there are no items.

  • Explore Button Label: Call-to-action button (e.g., "Explore store").

You can also add custom CSS for advanced styling under Manual CSS code.

Customize the separate page

When My Wishlist type is set to Separate page, the customization panel shows the page's own settings. The page lives on your storefront at a fixed address — for example, yourstore.com/pages/my-wishlist — and is created and published for you automatically.

  • Title — the heading shown at the top of the page (default: "My Wishlist").

  • Empty state — the message (default: "You didn't like any products yet!") and the call-to-action button (default: "Explore store") shown when the wishlist has no items.

  • Style — keep Based on your theme so the page matches your store's fonts and colors, or switch to set your own text and background colors. You can also add custom CSS for advanced styling.

The page shows each saved product with its image, title, variant, and price, plus an Add to Cart button (out-of-stock variants show a disabled button) and a remove button.

Preview and Save Changes

  • Use the Live Preview panel to see real-time updates as you make changes.

  • When you're happy with the design, click Save in the top-right corner.

Need help?

If you need help with layout or design, contact our support team. We're happy to help you align your wishlist with your store's branding.

Did this answer your question?