Read before you start
This option is the most complex one, before you continue make sure that:
- You have already tried to change the position via Add Block or via CSS class
- You have basic coding skills or access to a developer that administers your theme.
Step 1
Navigate to your Sales Channels > Online Store > Themes
Go to your most recent theme and click on the icon with the three dots [ ... ]
Select 'Edit code'
Step 2
Search for the file in which you can modify the layout of your product page. This is a liquid file that generally contains the name of 'product' (but each theme is a bit different)
Example: {/} main-product.liquid , {/} product.liquid , {/} product-template.liquid
Step 3
Enter the following Div in the relevant section of your code.
<div id="sizefox-container"> </div>
Example:
Step 4
Finally, click on Save and test your changes in your store by opening a product that contains an active size chart.
If you would like to change the position of the button, repeat the steps above by inserting the Div in a different position of your code.