Adding the swym-product-view snippet to your Shopify theme

Certain pages of your Shopify store like the Collections page for example, does not allow the Swym module to get your product data. While your Product Details page has only one product, your Collections page will have multiple products. This in turn means multiple Add to Wishlist or Notify Me buttons. So if your customer clicks on an Add to Wishlist button on the collections page, swym-product-view gets the information pertaining to that particular product and not from any of the other products on the same page.

The swym-product-view snippet gathers this product data based on the placement of the Swym button. For example, the heart icon on the product image or the Notify Me button.

Wishlist Plus
Back in Stock Product Alerts

To do this, you will need to go to Themes -> Actions -> Edit Code on your Shopify Dashboard.

Click on ‘Add a new snippet’.

Create a new snippet and call it ‘swym-product-view’.

Paste this code under this snippet.

{% comment %}
<!-- DO NOT EDIT!! - Auto generated file->
<!-- To add modifications, create a separate file and include in theme.liquid after {% include swymSnippet %}-->
{% endcomment %}
{%- if product -%}
<script class="swym-product-view-snippet">
['SwymViewProducts', 'SwymWatchProducts', 'SwymProductVariants'].forEach(function(k){
  if(!window[k]) window[k] = {};
});
(function(et){
    var collections = {{product.type | json}};
    var o={}, empi={{ product.id | json }},
    piu = {{ product.featured_image | img_url: '620x620' | json }};
    {% assign currentVariant = product.variants[0] %}
    {% for variant in product.variants %}
    {% if variant.selected %}
    {% assign currentVariant = variant %}
    {% endif %}
    SwymProductVariants[{{variant.id|json}}] = {
      empi:empi,epi:{{variant.id|json}},
      du:"{{ shop.url }}{{ product.url }}",
      dt:{{ product.title | json }},
      ct: collections,
      iu: {% if variant.image %} {{ variant | img_url: '620x620' | json }} {% else %} piu {% endif %},
      stk: {{variant.inventory_quantity}},
      pr: {{ variant.price }}/100,
      {% if variant.compare_at_price %} op: {{variant.compare_at_price}}/100, {% endif %}
      variants: [{ {{ variant.title | json }} : {{variant.id|json}}}]
    };
    SwymWatchProducts[{{variant.id | json}}] = o[{{variant.id | json}}] = {"id": {{variant.id | json}}, "available": {{variant.available | json}},"inventory_management": {{variant.inventory_management | json}},"inventory_quantity": {{variant.inventory_quantity | json}},"title": {{variant.title | json}}, "inventory_policy": {{variant.inventory_policy | json}}};
    {% endfor %}
    var product_data = {
      empi:empi, epi:{{ currentVariant.id }},
      dt	:{{ product.title | json }},du:"{{ shop.url }}{{ product.url }}",
      ct 	:collections,pr:{{ currentVariant.price }}/100,stk:{{ currentVariant.inventory_quantity }},
      iu	:{% if currentVariant.image %} {{ currentVariant | img_url: '620x620' | json }} {% else %} piu {% endif %},variants:[{ {{currentVariant.title | json}} : {{currentVariant.id | json}} }]
      {% if currentVariant.compare_at_price %} ,op:{{currentVariant.compare_at_price}}/100 {% endif %}
    };
    SwymViewProducts[{{product.handle | json}}] = SwymViewProducts[{{product.id | json}}] = product_data;
    SwymWatchProducts[{{product.handle | json}}] = SwymWatchProducts[{{product.id | json}}] = o;
  })();

</script>
{%- endif -%}

Save the file and you will now be able to customize the Swym apps to fit your brand better and use the many features we have to offer!

Let's discuss your needs!

Let's discuss your needs!

Let's discuss your needs!