Integrating Smart Wishlist to Smart Product Filter & Search Filter by Globo

In order to add wishlist button to the collection pages generated by Smart Product Filter & Search by Globo, please follow the instructions below

1. In the theme, open snippets/globo.filter.product.liquid

2. Add the following code immediately after <div class=”product-card__image-wrapper”>

<!-- Smart Wishlist for Collection begin -->
<span class="smartwishlist" data-product="{{ product.id }}" data-variant="{{ product.selected_or_first_available_variant.id }}"></span>
<!-- Smart Wishlist for Collection end -->

3. Add the following CSS to Apps > Smart Wishlist > Configure Appearance > Extra CSS. You can adjust the CSS as per your requirements.

.smartwishlist {
    position: absolute !important;
    right: 1px;
    top: 8px;
    font-size: 16px !important;
    background-color: #fff !important;
    border-radius: 20px !important;
    padding: 1px 5px !important;
    z-index: 99 !important;
}

Leave a Reply

Your email address will not be published.