Whilst we work on a Shopify plugin to make installation super simple, you must install Zyler on Shopify manually. The following instructions aim to make it as simple as possible for you.
InstallationOnce you have a partner ID, installation can be complete in 1 simple step.
Add the "Try-On" Button
To add the try-on button, you need to edit the
product-template.liquid theme file. This can be found from the shopify admin interface by clicking on "themes" under "Sales Channels" on the left-hand panel. On your live theme, click on the "Actions" dropdown and then click "Edit code". Now, locate
product-template.liquid and open it.
Copy and paste in the following code snippet in your desired location on the page - usually a good place to add this is right after the "Add to cart" button.
Note: If you change your theme, the above script will need to be added again.
testMode is set to
true, the "Try-on" button will not appear on your products page yet, so don't worry about your customers seeing the button that you haven't tested yet! For you to be able to see the "Try-on" button yourself, add
?show_zyler to the end of the URL of the product page desired. See configuration for more details.
The button is not styled in anyway so add any classes and/or styling required for it to fit into your site. If you're struggling with this, a good place to start is to find the style classes that a current button in your theme has. For example, on Google Chrome, find a button on your site, right-click and choose inspect and copy the classes from the highlighted element.
Move to Production Mode
Once you are happy with how the button looks, change
testMode: true to
testMode: false or replace all of the code you pasted in before with below - remember to set the button styling. You're now production ready!