Add the Zip on-site messaging manually - New Zealand
Shopify
Enable the Zip on-site messaging NZ
Let your customers know
Consumers are not always aware of the different payment options available to them before they reach the checkout. Knowing that Zip is available early on can influence the purchase decision. Enabling the Zip on-site assets is a great way to let them know even before they decide to buy.
Mobile view of Zip widgets
Desktop view of Zip widgets
What is involved in adding the widgets?
There are 3 key steps to be completed here:
- Add the Javascript to a new snippet
- Add the widget code to your product page template
- Add the widget to your cart page template
Setup the Zip widgets library
- In the Shopify admin dashboard, navigate to Online Store > Themes > Actions > Edit code
- Navigate to Snippets, then right-click and select Snippets > Add a new file
- Name the new snippet zip-widget
- Click Done
- Copy the zip-widget snippet code below and paste it into the snippet:
<script type="text/javascript" src="https://static.zip.co/lib/js/zm-widget-js/dist/zip-widget.min.js"></script>- Click Save
Add the Product Page widget
- Locate the product template file (usually sections/main-product.liquid)
- Search for render 'product-'price' or render 'price'
- Paste the following code directly after the last price:
<!-- Zip Widget -->
{% render 'zip-widget' %}
<div style="cursor:pointer"
id="zip-product-widget"
data-zm-widget="popup"
data-zm-region="NZ"
data-env="production"
data-zm-merchant="insert your AU merchant public id here or leave empty for NZ"
data-zm-price="insert product price here"
data-zm-asset="productwidget"
data-zm-popup-asset="termsdialog">
</div>
<!-- Zip Widget End -->- Click Save
Add the Cart Page widget
- In Shopify theme editor, navigate to Sections > main-cart-footer.liquid
- Search for the last occurrence of Shipping
- Paste the following code below the
</div>
<!-- Zip Widget -->
{% render 'zip-widget' %}
<div style="cursor:pointer"
id="zip-product-widget"
data-zm-widget="popup"
data-zm-region="NZ"
data-env="production"
data-zm-merchant="insert your AU merchant public id here or leave empty for NZ"
data-zm-price="insert product price here"
data-zm-asset="cartwidget"
data-zm-popup-asset="termsdialog">
</div>
<!-- Zip Widget End -->- Click Save
Next Steps
Updated 7 days ago