You want a See Size Chart button on the product page:
... that once clicked gives you this:
-
Create a page that contains your Size Chart. Set its handle to
size-chart
. -
Add a Size Chart button above your Add To cart button in product.liquid:
{% if product.options contains 'Size' %} <a class="btn open-popup" href="#size-chart">See size chart</a> {% endif %}
-
At the bottom of product.liquid, add this:
<div id="size-chart" class="mfp-hide"> {{ pages.size-chart.content }} </div> <style> #size-chart { border: 1px #555 solid; background-color: #ffffff; padding: 20px; max-width: 800px; margin-left: auto; margin-right: auto; } </style>
-
Before
</body>
tag in theme.liquid, add this:{% if settings.product_zoom_enable and template contains 'product' %} <script> $('.open-popup').magnificPopup({ type:'inline', midClick: true }); </script> {% endif %}
sorry was the above comment had to redo my account here....so yes it was very simple, and wondering if there is a way to add specific size charts to individual products...i guess there is a way, first would be to make the size-chart1 pages etc...and i guess this could be changed {{ pages.size-chart1.content }} but its how to assign the button to each handle that makes me think,lol....and iam no coder but it seems logical what i just wrote i hope,lol