Wishlist Hero

What this does

Wishlist Hero normally attaches its “add to wishlist” button to a product card once, when the page first loads. Because Smart Product Filter & Search re-renders product cards every time a shopper filters, sorts, or paginates, that button needs to be re-attached on each refresh — otherwise it stops working after the first interaction. Wishlist Hero also needs one small snippet added to your theme.

Turn on the integration

1. In the app, go to Settings > Integration.
2. Search for Wishlist Hero and turn on Enable integration.
3. Click Sync now on the Home dashboard.

Add the theme snippet

1. Go to Online Store > Themes > Edit code.
2. In theme.liquid, add this just above </body>:

<script>
window.addEventListener('globoFilterRenderCompleted', function () {
  document.querySelectorAll(".wishlist-hero-custom-button").forEach(function (wishlistButton) {
    var ev = new CustomEvent("wishlist-hero-add-to-custom-element", { detail: wishlistButton });
    document.dispatchEvent(ev);
  });
});
</script>

3. Save.

Related pages

• Wishlist apps
• App Integrations

Was this helpful?

Report an issue