Size charts

Add a size guide to your product page to help customers find the right size.

Set Up

1. From Shopify admin, go to Online Store → Themes.
2. Click Edit theme, then open a product template.
3. Select (+) Add block, then choose Variant picker.
4. Inside the Variant picker, select your Size chart page.
5. Click Save

---

Multilingual stores

The size chart button will only appear if the product's Size option name matches the language your customer is browsing in. For example, if a customer is viewing your store in French, the Size option name must be translated into French, otherwise, the size chart won’t appear.

To set this up:

1. Go to Settings → Languages in your Shopify admin to add and publish the languages you want to support.
2. Install the Translate & Adapt app or another compatible translation app.
3. Use the app to localize your product content, including the variant option names.
4. Make sure the Size "Option name" is translated in every published language.

When customers browse your store in their language, the translated variant option names will be shown, ensuring the size chart button appears when expected.

External links

• Shopify docs: Localization and translation
• Shopify docs: Add language translations using the Translate & Adapt app
• Translate & Adapt app

---

Dynamic Size Charts

To use different size charts for different products, you can set up Metafields. This allows each product to display a unique size chart dynamically.

Step ①

To begin, you must create a page reference metafield definition for your product pages. The product metafield links to a specific page and can be customized for each product.

1. From your Shopify admin, go to Settings → Metafields and metaobjects
2. In the Metafield definitions section, click Products
3. Click Add definition
4. In the Name field, enter Size chart
5. Click ⊕ Select type
6. Select Page from the drop-down menu. *One page is selected by default
7. Click Save

Step ②

You need to create a page with the size chart content that the metafield references.

1. From your Shopify admin, go to Online Store → Pages
2. Click Add page
3. In the Title field, enter Size chart, and then add the size chart information in Content.
4. In the Visibility section, set the page as Visible
5. Click Save

Step ③

Reference the page and apply the product template to specific products

1. From your Shopify admin, go to Products.
2. Click the product that you want to add a page reference to.
3. In the Product metafields section, click Size chart page reference, and then click Select pages and select the Size chart page.
4. In the Theme template section, select the Size chart product page template that you created.
5. Click Save

Step ④

When you add a page reference to a specific product, the information from that page displays only with that product.

1. From Shopify admin, go to Online Store → Themes

2. Click Edit theme next to the theme that you want to customize.

3. From the Home page drop-down menu at the top of the editor, click Products → Default product, and then open the Product page section.

4. Locate and open the Variant picker block (as in the setup above)

   NOTE

   Here instead of selecting a page, click Connect dynamic source then select the metafield you created.

5. Next to Page, click the dynamic source icon, and then click to select the page reference metafield that you created.