Size Chart Selection Logic

How Size Chart Selection Works

To display the appropriate size chart on a product page, we need to identify the size chart ID from product information. This page explains the logic used to select size charts.

Input Data

Product information used for size chart selection is retrieved from Shopify metafields.

Priority-Based Selection

To handle special products, size charts are determined using the following priority order.

Priority Details

1. Handle Exception (Highest Priority)

Assigns a dedicated size chart to specific product URLs (handles). Used for limited models or collaboration products that don't fit normal mapping rules.

Use Cases:

• Limited racing suits with dedicated size charts
• Collaboration products with different size notations

2. SKU Exception

Assigns a dedicated size chart to specific SKUs. Used when only certain SKUs within the same product family have different size notations.

Use Cases:

• Products where only specific sizes follow international standards
• Products where size systems changed after renewal

3. Normal Mapping

Determines size chart using the combination of category + productType + gender. Most products are processed by this rule.

Mapping Examples:

4. Unisex Fallback

If no matching size chart exists for the specified gender, searches for a "unisex" size chart. This is a fallback to support unisex products like cycling gear.

Example:

• cycling + jacket + men (not found) → Try cycling + jacket + unisex

When No Mapping Exists

If no size chart is found at any priority level, the "Size Chart" button is hidden on the product page. This is the correct behavior for products without sizes (accessories, etc.).

Implementation Points

Fallback Processing

// Simplified logic
const getSizeChart = async (product) => {
  // 1. Handle exception
  const handleChart = await checkHandleException(product.handle);
  if (handleChart) return handleChart;

  // 2. SKU exception
  const skuChart = await checkSkuException(product.sku);
  if (skuChart) return skuChart;

  // 3. Normal mapping
  const normalChart = await findByMapping(
    product.category,
    product.productType,
    product.gender
  );
  if (normalChart) return normalChart;

  // 4. Unisex fallback
  const unisexChart = await findByMapping(
    product.category,
    product.productType,
    'unisex'
  );
  return unisexChart; // May be null
};

Summary

The size chart selection logic uses a staged priority-based evaluation to flexibly handle everything from normal products to special cases. Handle and SKU exceptions enable individual handling, while the unisex fallback makes shared size charts available.