May 18, 2021 | Wishlist Hero
To add the collection view icon in the collection pages in a store using Globo Filter
1- Add the following code in a file called `snippets/globo-products.liquid`, in some themes the file might be called “snippets/globo-filter-products.liquid”
2- You can use this code to add the icon in place, the code to add just above the image for the product card is as follows:
<div class="wishlist-hero-custom-button wishlisthero-floating"
style="left: auto;" 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'}}"
data-wlh-mode="icon_only"></div>
May 17, 2021 | Wishlist Hero
1. Add and EDIT the following in `snippets/wishlisthero-styles.liquid`
“`html
<!-- wishlist hero Searnichse integration -->
<script>
$(document).on("Searchanise.ResultsUpdated", function (event, results) {
console.log("Results back ..");
document.querySelectorAll(" .snize-product").forEach(function (sp) {
if (sp.getAttribute("id")) {
var productId = sp.getAttribute("id").replace(/[^0-9\.]+/g, "");
var productUrl = sp
.querySelector("a.snize-view-link")
.getAttribute("href");
var productImage = sp
.querySelector("img.snize-item-image")
.getAttribute("src");
var productTitle = sp.querySelector(".snize-title").innerText;
var productPrice = 0;
try {
productPrice = sp.querySelector(".snize-price").innerText;
productPrice = parseFloat(productPrice.replace(/[^0-9\.]+/g, ""));
} catch (ex) {
console.log(ex);
}
var button = document.createElement("div");
button.setAttribute("data-wlh-id", productId);
button.setAttribute("data-wlh-variantid", productId);
button.setAttribute("data-wlh-price", productPrice);
button.setAttribute("data-wlh-link", productUrl);
button.setAttribute("data-wlh-name", productTitle);
button.setAttribute("data-wlh-image", productImage);
button.setAttribute("data-wlh-mode", "icon_only");
button.classList.add("wishlist-hero-custom-button");
button.classList.add("wishlisthero-floating");
sp.insertBefore(button, sp.querySelector(".snize-view-link"));
// now
var ev = new CustomEvent("wishlist-hero-add-to-custom-element", {
detail: button,
});
document.dispatchEvent(ev);
}
});
});
</script>
<!-- end wishlist hero Searnise integration -->
“`