How to add a size chart to product pages

Size chart is one of the features which give buyers the best shopping experience on a fashion e-commerce website. In GemPages, you can add a size chart by two methods:

  1. Using an Image element
  2. Using a Liquid element

Using an image element

It is very simple to show a size chart as an image.

  • Step 1: In the editor page, search for the "Image" element on the left sidebar.
  • Step 2: Then drag and drop the image element into your page
  • Step 3: Upload the image of the size chart under the Image settings tab

Using a liquid element

With this method, it requires you to prepare codes of a size chart. Don't worry, it is simple to get these codes even you don't have any coding knowledge. Here are the instruction for you:

  • Step 1: Create a table with specific sizes in the Description of a product in the Shopify admin panel. Then hit Save in the upper-right corner.

  • Step 2: Get the codes of the size chart by clicking on the "Show HTML" button in the top right corner of the description. 

  • Step 3: Copy all the codes associated with the size chart

  • Step 4: In the editor page, drag a liquid element into the Product module.