As you are probably aware, you need to assign your products to a size chart on the Sizefox dashboard for the widget to display on your product pages.
But you may want to preview the Sizefox widget before launching it live, and without having to add your size chart and map it to the relevant products.
In this article, we are going to share some tips how to preview the Sizefox widget on your testing environment with an unpublished Vintage Theme.
Also note that this requires changes in the code snippet, so please refer to your web developer if you do not feel confident updating the code yourself.
Warning: please try this on your testing environment only, as it will ignore all the product/size chart assignment rules! If you save the changes in your live environment, they will be applied in all of your live product pages.
If you are ready to proceed with activating the widget preview mode in your unpublished Vintage Theme, you can do so by modifying the property previewMode: true on your code snippet as follows:
<script> window.Sizefox = { orgId: "custom-9999", platformId: "my-shopify.myshopify.com", previewMode: true, product: { serial: "{{ product.id | json }}", title: {{ product.title | json }}, keywords: {{ product.tags | json }}, vendor: {{ product.vendor | json }}, }, }; </script> <script type="text/javascript" charset="utf-8" defer src="embedder.sizefox-bundle.js"></script>
By changing the property to “previewMode: true” and saving you will be able to preview the widget, and you can then expect the following behaviour in the product pages of the unpublished theme:
-
All your product pages (independently of the fact that they have been assigned or not assigned to a size chart) will display the “Find my Size” button.
-
All your product pages will display the same size chart filled with random data.
-
All your products will handle recommendations based on the random data inserted in the size chart, therefore returning random recommendations.