Smart Product Filter & Search by Globo

Adding Collection View Icon with Globo Filter

Adding Collection View Icon with Smart Product Filter & Search by Globo

Steps to Add Collection View Icon

To add the collection view icon on collection pages in a store using the Globo Filter, follow these steps:

Go to Online Store > Themes > Edit Code.
Add the following code in a file called snippets/globo-products.liquid. In some themes, the file might be named snippets/globo-filter-products.liquid.

Use the code below to add the icon in place. Add it just above the image in the product card:

 <div data-wlh-id="{{product.id}}" 
      data-wlh-link="https://{{shop.domain}}{{product.url}}"
      data-wlh-variantid="{{product.selected_or_first_available_variant.id}}" 
      data-wlh-price="{{product.selected_or_first_available_variant.price | remove: '.' | remove: ',' | divided_by: 100.0 }}" 
      data-wlh-name="{{product.title | strip_html }}" 
      data-wlh-image="{{product.featured_image | img_url: '1024x'}}" 
      class="wishlist-hero-custom-button wishlisthero-floating" 
      data-wlh-mode="icon_only"
      style="left: auto;">
  </div>