$5Intermediate

Size Chart Modal

Popup size chart triggered from product page. Supports custom metafields for per-product sizing data with a global fallback table. CM/Inches toggle with live conversion.

Category: Product Compatibility: All OS 2.0 Themes Updated: Feb 2026

snippets/plynthr-size-chart-modal.liquid Purchase — $5

{% comment %}
  Plynthr — Size Chart Modal (Premium)

  This is a preview of the snippet. Purchase to receive:
  ✓ Full source code (.liquid file)
  ✓ Installation guide (README)
  ✓ Metafield setup instructions
  ✓ Support via plynthr.com/contact

  FEATURES:
  - Per-product size charts via custom.size_chart JSON metafield
  - Global fallback chart (editable in template)
  - CM / Inches toggle with live conversion
  - Accessible modal (Escape, focus trap, ARIA)
  - Responsive bottom sheet on mobile
  - Sticky header with close button
  - CSS custom properties for easy theming
{% endcomment %}

{%- comment -%}
  Expected metafield JSON format:
  {
    "title": "Women's Tops",
    "unit": "cm",
    "headers": ["Size", "Chest", "Waist", "Hips"],
    "rows": [
      ["XS", "82", "62", "87"],
      ["S", "86", "66", "91"],
      ["M", "90", "70", "95"]
    ],
    "note": "Measurements in cm."
  }
{%- endcomment -%}

<!-- Full code available after purchase -->
<!-- Includes: 250+ lines of Liquid, CSS, and JavaScript -->
<!-- Fully documented with installation guide -->

Installation

Purchase the snippet from Gumroad — you'll receive a .zip with the .liquid file and README.md
In your Shopify admin, go to Online Store → Themes → Edit Code
Under Snippets, click "Add a new snippet"
Name it size-chart-modal
Paste the code from the downloaded file and save
Open your product template and add the render tag near the variant selector
Optionally set up the custom.size_chart metafield for per-product data (see README)

Customization

10+ CSS custom properties for colors, sizing, and backgrounds
Per-product sizing via JSON metafield
Editable global fallback table
CM/Inches toggle works on any numeric data
Trigger button text and icon are customizable

Want your whole store dialled in?

Snippets fix one thing at a time. Want your whole Shopify store audited and tuned — speed, SEO, conversion? Get a free audit in about 60 seconds, or work with me directly.

Purchase — $5 Run your free store audit →

✓ Speed, SEO & mobile✓ Results in ~60s✓ No signup

FAQ

What do I get when I purchase?

A .zip file containing the full .liquid snippet (250+ lines) and a detailed README.md with installation steps, metafield setup, and customisation options.

Do I need metafields for every product?

No. Products without the custom.size_chart metafield will show the global fallback table, which you can edit directly in the Liquid file.

Can I use it on multiple stores?

Yes. No license restrictions — use it wherever you need.

Size Chart Modal

Installation

Customization

Want your whole store dialled in?

FAQ

Related Snippets