How to show multiple size charts on the WooCommerce product page

Let's you create branded, mobile-friendly size charts and place them as a pop-up, tab, or inline block. You can attach one or several charts to the same product for different garments, regions, or measurement units.

Benefits of a multiple-size chart

Multiple size charts per product — create more than one chart and assign them all to a single product. Each chart keeps its own title, layout, and display position (Popup / Tab / Inline).

Use of multiple size charts

• One product can need different fit guides (e.g., Top vs Bottom; US vs EU sizes; Inches vs Centimeters).
• Reduces confusion and pre-purchase questions.
• Lowers wrong-size returns by showing the most relevant chart.

How to configure — step guide

Access the plugin

Goto: Dashboard → Dotstore → Product size chart → Size chart

Create chart #1

1. Go to Dotstore → Product size chart → Size chart and click Add new.
2. Enter a Chart Title (e.g., “US Sizes - in”).
3. Build the table (rows/columns), add unit notes (e.g., in).
4. Select Display Position (Popup / Tab / Inline). Set button text if Popup (e.g., “Size Guide — Top”).
5. In the right-side Product selection widget, choose the product(s) this chart should appear on.

6. Click Publish.

   

Create chart #2 (and more)

7) Click Add new again.

8) Title (e.g., “EU Sizes - cm”).

9) Build table, choose Display Position, set button/tab text.

10) In the right-side Product selection, choose the same product as chart #1.

11) Publish.

Verify on the front end

12) Open the product page. You should see multiple charts (multiple buttons/tabs or multiple inline blocks) based on your positions.

Real examples

Example 1 — Men’s Tracksuit (Top + Bottom, inches)

• Chart 1: US Men’s Top (in) → Popup button “Top Size Guide”
• Chart 2: US Men’s Bottom (in) → Popup button “Bottom Size Guide”
• Assign both charts to the same product “Sparta Tracksuit Pro”.

Example 2 — Women’s Sneakers (US vs EU)

• Chart 1: US Women’s Shoe Size (in) → Tab label “US Sizes”
• Chart 2: EU Shoe Size (cm) → Tab label “EU Sizes”
• Assign both charts to “Aero Run Sneaker”.

Expected outcome

• The same product page displays multiple size charts (separate buttons/tabs/sections).
• Shoppers quickly pick the most relevant guide → more confident purchases and fewer returns.
• Merchandisers can attach additional charts later without code changes.

FAQs

1) Can I mix display positions (e.g., one popup, one tab)?

Yes. Each chart’s position is independent. Use clear labels so shoppers know which to open.

2) Will this work with Elementor/Divi/Block Editor?

Yes. Charts render on the product page regardless of the page builder.

3) Can I reuse the same chart on many products?

Absolutely. Assign one chart to multiple SKUs from the Product selection widget.

4) Can I show inches and centimeters separately?

Yes. Create two charts (e.g., in and cm) and assign both to the product. Label the buttons/tabs clearly.

5) What if I only want charts to show on certain variants?

Create separate charts and condition your PDP content (or duplicate the product) if you need variant-specific visibility. For most stores, variant-labeled chart buttons/tabs are sufficient.