How to Create a Shopify Size Chart with Pages, Metafields, or Apps

A Shopify size chart is a table of measurements that helps shoppers choose the right size before they buy. Shopify doesn’t include a dedicated size chart feature, so you add one by creating a page with the chart and showing it on product pages through your theme, linking it with metafields, adding custom code or using a size chart app.

Clear sizing information helps customers buy with confidence and can reduce fit-related returns and support questions. The right method depends on how many products you sell, how many different charts you need and how comfortable you are editing your theme.

How to Add a Size Chart in Shopify

There are four main ways to add a size chart, from a simple linked page to a full app with display rules. Each suits a different catalog size and skill level, as this comparison shows how they differ:

Custom Liquid code is a fifth option for developers who want full control over how the chart looks and when it appears. It requires editing theme files, so duplicate your theme before making changes.

Create a size chart page

Most native methods start with a page that holds the chart. Creating it takes a few minutes:

1. In your Shopify admin, go to Online Store > Pages and click Add page.
2. Give the page a clear title, such as “Women’s Tops Size Chart.”
3. Use the table tool in the editor to add your sizes and measurements, plus a short note on how to measure.
4. Set the page to visible and save it.

A hidden page won’t load when shoppers open it from a product page. If you sell several product types, create one page for each chart rather than combining everything into one long table.

Show the chart on product pages with a theme block

Many themes include a pop-up or collapsible row block in the product information section that can display page content. Open the theme editor, go to your product template and add the block near the size selector or Add to cart button.

Select your size chart page as the block’s content and give it a clear label, such as “Size Guide.” Save the template and test it on a live product page on both desktop and mobile.

Use metafields for product-specific charts

If different products need different charts, a page reference metafield lets each product point to its own chart. Go to Settings > Custom data > Products and add a metafield definition with the page reference type, then choose the right chart page on each product.

In the theme editor, connect your pop-up or collapsible block to that metafield using the dynamic source option. Each product page then shows its own chart, and products without a value can be left without the block.

To use an image instead, create a file metafield limited to images, upload the chart to each product and connect it to an image section. Use a wide, high-resolution image so the text stays readable on smaller screens.

Use a size chart app

Size chart apps handle creation, display and assignment in one place. Most install through a theme app extension, so you enable the app in the theme editor rather than editing code.

Apps typically let you build charts from templates or blank tables, switch between inches and centimeters, add how-to-measure tabs and choose how the chart opens, such as a popup, inline table or side panel. You then assign charts with rules based on product, collection, vendor, product type or tags, so new products pick up the right chart automatically.

Some apps go further with international size conversions, translations into your store’s languages or fit recommenders that suggest a size from a shopper’s details. Compare free plans, limits and theme compatibility before choosing one.

Where to Place Your Size Chart

A size chart only helps if shoppers see it while choosing a size. Place the link or button right next to the size selector or just above the Add to cart button.

Use a short, familiar label such as “Size Guide,” “Size Chart” or “Find Your Size.” A chart linked only from the footer or buried at the bottom of a description is easy to miss.

A dedicated size guide page linked from your menu or footer is still useful as a reference. Treat it as an extra, though, not a replacement for a chart on each product page.

What to Include in a Shopify Size Chart

A good size chart gives shoppers enough detail to compare their own measurements with your sizes. The exact columns depend on the product, but most charts should include these elements:

• Exact measurements. List measurements for each size, not just S, M and L labels.
• The right measurements for the product. Use chest, waist, hips and length for apparel, foot length for shoes and the relevant dimensions for accessories or pet products.
• How to measure. Add a short guide or diagram so shoppers measure themselves the same way you measured the product.
• Fit notes. Say whether the item runs true to size, slim, relaxed or oversized, and whether the fabric stretches.
• Both units. Show inches and centimeters if you sell to international customers.
• Regional sizes. Add US, UK and EU equivalents where they apply, such as for shoes.

Make clear whether your chart shows body measurements or garment measurements, since the two differ. Explaining this avoids confusion when shoppers compare the chart with clothes they already own.

Size Chart Best Practices

A few habits keep size charts accurate and easy to use as your catalog grows. Apply these when you set up and maintain your charts:

• Use product-specific charts. One generic chart rarely fits every product type or supplier.
• Prefer text tables to images. Text tables are easier to read on mobile and to update when measurements change.
• Keep tables simple. Limit columns so the chart doesn’t overflow on small screens.
• Test on mobile. Make sure pop-ups open, scroll and close easily on phones.
• Update charts when products change. Revise measurements when a supplier, cut or fabric changes.
• Learn from feedback. If reviews or returns say an item runs small or large, update the chart or add a fit note.

Native Method or App: Which Should You Choose?

Native methods cost nothing and give you full control, but you assign and maintain charts yourself. They suit stores with a small catalog, a handful of charts and someone comfortable working in the theme editor.

Apps save time when you sell many product types, add products often or sell internationally. Rules-based assignment, unit conversion and templates reduce manual work, though most advanced features come with paid plans.

Whichever you choose, start with accurate measurements. The display method matters less than giving shoppers sizing information they can trust.

Common Size Chart Problems

Many size chart issues come from theme settings or missing assignments. Most take only a few minutes to fix, so watch for these:

• The chart doesn’t appear. The page is hidden, the block wasn’t saved or the product has no metafield value.
• The metafield isn’t available in the theme editor. The definition uses the wrong type or the block doesn’t support dynamic sources, so check both and refresh the editor.
• The table overflows on mobile. Too many columns, so simplify the table or let it scroll sideways.
• New products are missing charts. Manual metafields weren’t filled in, which rules-based app assignment can prevent.
• The chart conflicts with the theme. An app or custom code clashes with theme updates, so test after updating your theme.
• Shoppers still choose the wrong size. The chart lacks how-to-measure guidance or fit notes.

Conclusion

A Shopify size chart gives shoppers the information they need to pick the right size and buy with confidence. Whether you use a page, metafields or an app, clear measurements placed next to the size selector make your product pages more helpful and your returns easier to manage. We hope this guide helps you add the right Shopify size chart to your store.