All Tutorials

Add a size chart to product pages

All Tutorials

Add a size chart to product pages

Add a size chart to product pages

If you sell clothing items that require customers to know their size before they make a purchase, you can add a custom size chart to your product page.

All products that require reference to the size chart must have a Size option:alt

Sectioned and non-sectioned themes


Setting up a size chart specific to a vendor or product type

If you selected a size chart specific to a vendor or product type, you will need to make a size chart for each vendor or product type. The process is the same as making a chart for the whole shop, except you need to put the vendor or product type at the beginning of the size chart page title and handle. For example, if you have a vendor called Great Owls, your size chart page would be named Great Owls Size Chart, and the handle of the page would be great-owls-size-chart:

If your size chart is for a product type, you might have a chart for product type shoes. You would then call your size chart page Shoes Size Chart, and the handle would be shoes-size-chart .

Using a different language or changing the 'Size chart' text

If your store's operating language is not English, or you want to use different text than 'Size chart' on your product page, you can make these changes in your size chart snippet.

  1. In the Snippets directory, click size-chart.liquid.

  2. Find {% assign size_options = 'size,taille' | split: ',' %}.

  3. Edit the size_options values to match the translation you have for your product option. Separate each option value with a comma.

    For example, to add a German translation, you might change the code to:

    {% assign size_options = 'size,taille,Größe' | split: ',' %}

  4. Find {% assign size_chart_text_link = 'Size chart' %}.

  5. Replace Size chart with the wording that you prefer.

  6. Click Save.