Rendered Fits · Merchant guide
How to add a size chart or size guide in Shopify
You can add a size guide to Shopify product pages without an app. Put the chart on a page, then link it from the product page as a pop-up. For a different chart on each product type, add a product metafield. We checked these steps against the code of Shopify’s Dawn and Horizon themes.
By the Rendered Fits team · Reviewed 19 October 2026
Before you start: make the chart text, not a picture
In September 2026 we scanned 829 Shopify clothing stores. In 27.7% of them we found no size chart at all, and 27.1% published their chart as a picture. Only 31.6% had a chart that could be read as text on the page. The full data is in our Size Chart Report 2026.
A text table can be zoomed on a phone without blurring. Screen readers can read it, and so can search engines and AI shopping assistants. With a picture, all three only get the alt text. Shopify’s page editor has a table tool, so you can build the chart as a real table.
Method 1: one size guide for the whole store (Dawn)
This works in Dawn and in most of Shopify’s free themes built on it. It takes about ten minutes.
- Create the size guide page. In your Shopify admin, go to Online Store > Pages and click Add page. Title it “Size guide”, add your chart as a table, leave Visibility set to Visible, and save.
- Open the product template. Go to Online Store > Themes and click Customize. Use the page selector at the top of the editor to open Products > Default product.
- Add a Pop-up block. In the Product information section, click Add block and choose Pop-up. Set Link label to “Size guide” and choose your size guide page under Page.
- Put it next to the sizes. Drag the Pop-up block so it sits just below the Variant picker, where shoppers choose their size. Click Save.
If you would rather show the chart on the page itself, add a Collapsible row block instead and choose the page under “Row content from page”. Dawn’s row icons include a ruler. Paid themes usually have a similar block; look for Pop-up, Popup, Modal or Size chart in the block list.
Method 2: a different size chart for each product type
One chart rarely fits a whole catalogue. A dress and a pair of jeans need different measurements, and two suppliers can cut the same size differently. A product metafield lets each product point to its own size guide page while the theme keeps a single pop-up.
- Make one page per chart, for example “Size guide: dresses” and “Size guide: jeans”, in the same way as step 1 above.
- Add a product metafield. Go to Settings > Metafields and metaobjects > Products and click Add definition. Name it “Size guide”, choose the Page type (under Reference) and save.
- Choose a chart for each product. Open a product, find the Size guide field in its Metafields section and select the right page.
- Connect the pop-up. In the theme editor, select the Pop-up block. Next to Page, click the Connect dynamic source icon and choose the Size guide metafield. Save.
Dawn shows the pop-up link even on a product with no chart selected. Give every product on that template a chart, or make a second product template without the Pop-up block for products that don’t need one.
Method 3: Horizon and the themes built on it
Shopify’s newer Horizon themes build pop-ups out of blocks.
- Create the size guide page as in method 1.
- Add a Popup link. In the theme editor, open the product template. In the Product information section, select the Details block, click Add block and choose Popup link. Set its text to “Size guide”. Under Behavior, choose Drawer if you want it to slide in from the side.
- Put the chart inside it. Add a Page block inside the Popup link and choose your size guide page. For a chart per product, connect the Page block’s page setting to the Size guide metafield from method 2.
- Move it under the variant picker and save.
When a size chart app is worth it
The free methods cover a fixed chart per product type. An app earns its fee when you have many product types or suppliers, when you want unit conversion and translations without maintaining extra pages, or when shoppers keep asking which size to buy. Check two things before you install one.
Where the chart lives. Many apps draw the chart with JavaScript after the page loads, so it is not in the page’s HTML. In our scan, 7.7% of stores showed their chart only through a sizing app’s script.
Whether it answers “which size?” A chart lists measurements and leaves the shopper to measure themselves and do the maths. A size recommender turns the chart into a suggested size.
We compare the main apps, with their prices and review counts, in the best size chart apps for Shopify.
What to put in your size chart
These are the gaps we found most often in the 829-store scan.
| Include | Why it matters |
|---|---|
| Every size you sell | 9% of stores sold sizes that their chart did not cover. |
| One spelling per size | 23.3% of stores labelled the same size in different ways, such as S, Small and SM. That also splits your size filters. |
| Centimetres and inches | 47.7% of the readable charts gave only one unit. |
| What was measured | Say whether figures are body or finished-garment measurements, and whether a width is flat or all the way round. A 48 cm flat chest is a 96 cm chest. |
| Fit notes and the model’s size | 73.8% of stores never gave the model’s size or height. “Runs small” or “model is 175 cm and wears S” settles close calls. |
Run the free size chart audit to check your store for these in a few seconds, or work through the size chart checklist by hand.
From a size chart to a size for each shopper
Rendered Fits reads the size charts you already have and recommends a size to each shopper on the product page. Complete the Look outfits are sized the same way, and shoppers can preview items on themselves. It is free on one product, and Complete is $349 per month with a 14-day trial.
Questions merchants ask
Can I add a size chart to Shopify without an app?
Yes. Create a page with your chart as a table, then add a Pop-up block (Dawn) or a Popup link with a Page block inside it (Horizon) to your product template and choose that page. It takes about ten minutes and costs nothing.
How do I show a different size chart on each product?
Create one page per chart and add a product metafield of the Page type. Choose the right page on each product, then connect the pop-up’s page setting to that metafield in the theme editor.
Should my size chart be an image?
No. Use a text table. Shoppers can zoom it cleanly on a phone, and screen readers, search engines and AI shopping assistants can read it. In our scan of 829 stores, 27.1% still published their chart as a picture.
Where should the size guide link go?
Directly below the size selector, so shoppers see it at the moment they choose a size. In Dawn, drag the Pop-up block under the Variant picker block.