← Back to Blog

Setting Up Complex Size Charts and custom Dimensions on Shopify

Selling custom-sized goods—such as tailored apparel, custom curtains, window blinds, custom glass, or made-to-measure furniture—presents a unique challenge on Shopify. Standard e-commerce platforms are built for static, pre-packaged goods. When a product's price, shipping weight, and manufacturing requirements depend on exact measurements provided by the buyer, standard product variants fall short.

To sell custom-dimension products successfully, merchants must capture precise measurements, guide customers through complex sizing charts, and calculate dynamic prices on the fly. Here is a guide to setting up complex size charts and custom dimensions on Shopify using GP Product Options.

The Challenge of Complex Dimensions in E-commerce

For custom-fit products, minor measuring errors lead to costly product returns. Unlike standard items, custom goods cannot be easily restocked and resold, representing a direct loss to your business.

Merchants selling custom-dimension items face three major hurdles:

  • Measurement errors: Customers misinterpreting size charts or providing wrong dimensions.
  • Unit conversions: Balancing shoppers who use imperial measurements (inches, feet) with those who use metric systems (centimeters, meters).
  • Dynamic pricing: Adjusting price based on the square area or linear length of the custom item (e.g., charging $12.00 per square foot of custom fabric).

Relying on standard Shopify variants to represent these custom sizes is impossible, as you would need thousands of variants to cover every possible height and width combination.

Why Static Size Charts are Not Enough

Most e-commerce stores use a static image link for size charts. While this works for standard apparel (Small, Medium, Large), it is insufficient for custom-configured products. Shoppers need real-time feedback, interactive measurement tools, and clear validation on the product page itself.

If a customer must leave the product page to decipher a sizing table, you lose them. The sizing guide must be integrated directly into the purchase flow.

Key Features of GP Product Options for Dimensions

GP Product Options provides the toolset required to handle custom-fit products. By leveraging its dynamic input fields, you can build a responsive, mistake-proof dimension calculator.

Custom Dimension Text Inputs

Instead of dropdown menus with rounded sizes, GP Product Options lets you display number input fields for Width, Height, and Depth. You can set minimum and maximum values (e.g., Width must be between 10 inches and 120 inches). If the customer inputs a number outside this range, the app prevents them from adding the item to the cart, showing a clear warning message.

Dropdown Option Groups

For complex setups, you can organize sizing categories into logical option groups. For example, a customer first selects a size category (e.g., Window Width: 30-40 inches), and conditional logic then reveals the exact measurement input fields. This multi-step process keeps the interface clean and easy to navigate.

Dynamic Price Calculations Based on Dimensions

GP Product Options allows you to calculate prices dynamically based on the numbers entered by the shopper. By setting pricing rules per unit, the app calculates the surcharge on the fly. A buyer who enters a width of 50 inches is charged a different amount than a buyer who enters 85 inches, with the total price updating dynamically on the screen.

Step-by-Step Configuration Guide

Follow these configuration steps to deploy a dynamic sizing system:

Step 1: Create the Base Option Set

Open the GP Product Options dashboard. Click Create Option Set and target your custom-sized products.

Step 2: Set Up Dynamic Unit Selectors (Inches vs. Centimeters)

Create a radio button selection titled Unit of Measure with options for Inches and Centimeters.

Next, create two number input fields: Width and Height. Use conditional logic to display the width and height inputs with the correct suffix ("in" or "cm") based on the customer's selection in the Unit of Measure field. Set validation parameters to enforce limits (e.g., minimum 20 cm, maximum 300 cm).

Step 3: Implement Size Charts and Information Triggers

To prevent sizing errors, use the app's HTML/text block feature to insert a clean sizing chart or a measurement guide directly below the inputs. You can display this as a toggleable modal or a collapsible accordion, allowing shoppers to review measurement instructions without leaving the checkout page.

Comparison: Standard Sizing vs. Custom Dimensions

Sizing Capability Standard Shopify Variants GP Product Options
Exact Custom Inputs Not supported natively Number inputs with validation
Unit Conversions Requires separate products Dynamic toggles (Inches / CM)
Price-by-Dimension Calculations Manual coding or separate apps Built-in mathematical pricing formulas
Input Range Validation None (accepts any value) Limits defined by minimum/maximum bounds
Page Layout Integration Rigid, theme-dependent Customizable blocks and modals
Impact on Store Performance High variant bloat Light, theme-native integration

Driving Conversions and Lowering Returns

Integrating size charts and validation rules directly into the product configuration flow reduces customer confusion and returns. By using GP Product Options to handle unit selection, character boundaries, and dynamic pricing, you build a reliable buyer journey that guides the user to the correct product configuration every time.