A Shopify product size chart helps customers choose the right fit, reduce return rates, and improve the shopping experience, especially for fashion, apparel, and accessories stores.
With GemPages, you have full flexibility to create a custom size chart using either a pre-designed image or dynamic HTML pulled from your Shopify Admin. Let’s walk through how to add a size chart to your Shopify product page.
How to Add a Size Chart in Shopify Using GemPages
A size chart is essential for helping customers pick the right fit. With GemPages, there are two easy ways to add a size chart in Shopify:
- Use an image (great for pre-designed size chart visuals)
- Use a Liquid element (ideal for embedding HTML or tables)
Method 1: Use an image element
Step 1: From the GemPages dashboard, open the page you want to edit. You can quickly find the Image element on the left sidebar of the Editor. Next, drag & drop the element to any position you prefer.
Step 2: Click on the element to reveal the configuration options in the left sidebar. Upload the image of the product size chart under the Settings tab’s Image section.
Method 2: Use a Liquid element
This method involves coding, but you don’t actually need to write it yourself! Simply follow the steps below:
Step 1: From your Shopify Admin > Products > All Products, select your preferred product.
Step 2: Under the Description section, create a size chart with the Table function. Hit “Save” when finished.
Step 3: Get the code of the size chart by clicking on the “Show HTML” button in the top right corner of the description.
Next, copy all code lines.
Step 4: From the GemPages dashboard, open the page you want to edit. You can quickly find the Liquid element on the left sidebar of the Editor. Next, drag & drop the element to any position you prefer.
Step 5: Right-click on the Liquid element, then select “Edit” to open the code panel.
Paste the code you copied earlier to the Template panel. Hit “Save” when finished.
Please note that the size chart will not be displayed in the Editor. After everything is in place, hit “Save” and check how the size chart looks like with the “Preview” button.
If you’re satisfied with the result, click “Publish” to bring the size chart to your live store.
Learn more:
- 16 Best Shopify Apps For Clothing Stores
- 15+ Best Shopify Themes for Clothing Stores
- How to Add a Size Chart to Shopify Product Pages?
FAQs
1. How to add a size chart in Shopify without an app?
Use GemPages to add a size chart by either uploading an image or embedding a custom HTML table using the Liquid element — no extra apps needed.
2. What is the best way to show a size chart on a product page?
It depends on your needs:
- Use an image for simple size charts or brand-designed visuals
- Use custom HTML for flexible tables that you can update directly from Shopify’s product descriptions
3. Can I reuse the same size chart across multiple products?
Yes. Upload your size chart image once and use it on multiple product pages, or embed a standard table using the Liquid element and copy-paste it wherever needed.
4. Will the size chart show up in the mobile view?
Yes. GemPages’ elements are fully responsive, so your custom size chart (whether image or HTML) will adapt to mobile, tablet, and desktop views.
Thank you for your comments