How to show weight and materials on Shopify jewelry product pages

A photograph shows the finish. A weight in grams gives shoppers a sense of how the piece will feel. That matters when they are choosing between a lightweight ear cuff and a heavier piece of hand-forged silver jewelry. A product page can show the finish, the item number, and the exact weight alongside the photograph.

Yana Potapova’s Heritage: Men’s Jewelry Brand Identity is a storefront design study for CODESTAL. It pairs oxidized 925 sterling silver with a grayscale interface, a care link in the main navigation, and a shopping bag that shows the details of the order. This article uses the design as a reference for an independent Shopify store and includes a complete Liquid Section example.

The project frames the brand around roots and passing things to a future generation. Its desktop hero and mobile product page both give the metal texture and the photography room to speak.

1. Four design decisions in the CODESTAL project

1.1 Four grayscale colors leave room for the metal

The project’s palette specifies four interface colors.

• Black (#000000) anchors dark areas and purchase buttons such as ADD TO BAG and COMPLETE PURCHASE.
• Charcoal (#1A1A1A) creates a separate layer for dark brand-story areas and the footer.
• Slate gray (#383838) works for secondary text, rules, inactive filters, and table borders.
• White (#FFFFFF) gives product lists and detail panels a clean background and high contrast on dark sections.

Oxidized silver gets much of its character from the contrast between dark recesses and highlights on hammered surfaces. A grayscale interface leaves that contrast visible. Use the same principle for other materials that carry visual character, such as titanium and hand-finished leather.

1.2 Put the item number and weight where shoppers can see them

CODESTAL moves product identifiers out of the fine print. The project shows identifiers on product cards, and selected items, the quick view, and the shopping bag show weight where it is relevant to the purchase.

Examples of archive-style item numbers include UGS28\36\2023\1 for forged-metal silver earrings, UG52/40/243/1 for hand-forged silver earrings, and CODE048 for the Boldness design. Example weights in the study include 4.10 g, 6.58 g, and 1.50 g.

• Give shoppers a physical reference. A figure such as 4.10 g helps them judge the weight of an earring or ear cuff without handling it. The material and hallmark belong in the specifications.
• Make the product identifier part of the design. A Shopify variant SKU can use an archive pattern such as UGS28\36\2023\1 when that pattern fits the catalog. Repeating the same identifier in the product view and shopping bag keeps the item easy to recognize. A label such as \ YOUR BAG \ continues the visual language.

1.3 Make product care easy to find before checkout

The desktop header puts COLLECTION +, OUR STORY, and PRODUCT CARE on the left. The CODESTAL wordmark sits in the middle. RETURNS & REFUNDS, SHIPPING, and the account, wishlist, and bag icons sit on the right.

Hammer marks, natural patina, and changes in an oxidized finish can lead to questions after a purchase. Top-level links let customers find care, delivery, and returns before ordering. The product detail uses Specifications and Warranty as separate tabs. Specifications can describe the metal and finish, while the warranty tab can explain the merchant’s actual coverage and care instructions.

1.4 Use the grid and shopping bag to make decisions clear

2. Implement the product details in Shopify

SKU and weight are native Shopify variant data. The storefront can read them through Liquid. Use product metafields to keep the material and care descriptions consistent across products when the theme is connected to those fields.

2.1 Map native fields and three optional metafields

2.2 Complete Liquid reference section

Save the sample as sections/codestal-jewelry-showcase.liquid and add the section in the theme editor. It uses the four grayscale colors, Audiowide headings, five filter choices, product metadata, and a Specifications / Warranty modal opened by SPECS +.

Choose a real product for each block. The example’s preset values illustrate the design. Clear or replace the preset item number and weight before showing a real product, and check the selected variant’s measurement unit. The example takes material and warranty from the block settings. Connect the corresponding metafields when adapting it to a store. The sample’s purchase buttons link to the product page. Direct add to cart requires the theme’s product form or cart integration.

{%- comment -%}
  文件：sections/codestal-jewelry-showcase.liquid
  设计参考：Heritage: Men's Jewelry Brand Identity - CODESTAL (by Yana Potapova)
  功能：无彩色粗野主义银饰陈列柜，支持肌理/款式筛选、货号与克重外露、以及 Specifications / Warranty 双标签快购弹窗
{%- endcomment -%}

<link rel="preconnect" href="https://fonts.googleAPIs.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Audiowide&family=Inter:wght@300;400;600&display=swap" rel="stylesheet">

<style>
  .codestal-sec-{{ section.id }} {
    --c-black: #000000;
    --c-charcoal: #1A1A1A;
    --c-slate: #383838;
    --c-white: #FFFFFF;
    --c-border: #2B2B2B;
    --c-font-title: 'Audiowide', sans-serif;
    --c-font-body: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;

    background-color: var(--c-black);
    color: var(--c-white);
    font-family: var(--c-font-body);
    padding: {{ section.settings.padding_top }}px 0 {{ section.settings.padding_bottom }}px;
  }

  /* 遵循原案 1920px 桌面 60px 边距 / 375px 手机 20px 边距规范 */
  .codestal-container {
    max-width: 1440px;
    margin: 0 auto;
    padding: 0 60px;
  }
  @media screen and (max-width: 768px) {
    .codestal-container {
      padding: 0 20px;
    }
  }

  /* 顶部宣言与斜杠副标题 */
  .codestal-header {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: flex-end;
    gap: 24px;
    padding-bottom: 32px;
    border-bottom: 1px solid var(--c-slate);
    margin-bottom: 32px;
  }
  .codestal-slash-tag {
    font-size: 1rem;
    font-weight: 300;
    line-height: 1.2;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--c-white);
    opacity: 0.75;
    margin-bottom: 12px;
  }
  .codestal-main-title {
    font-family: var(--c-font-title);
    font-size: clamp(2rem, 3.8vw, 4.25rem); /* 最大对应原案 68px */
    font-weight: 400;
    line-height: 1.2;
    text-transform: uppercase;
    color: var(--c-white);
    margin: 0;
    max-width: 820px;
  }
  .codestal-manifesto {
    max-width: 360px;
    font-size: 1rem; /* 原案 16px Light */
    font-weight: 300;
    line-height: 1.2;
    color: #CCCCCC;
    margin: 0;
  }

  /* 款式与肌理筛选条：MINIMAL / TEXTURED / FASHION / EAR CUFF */
  .codestal-filter-bar {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    margin-bottom: 40px;
  }
  .codestal-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
  }
  .codestal-tab-btn {
    background: transparent;
    color: var(--c-white);
    border: 1px solid var(--c-slate);
    padding: 10px 20px;
    font-family: var(--c-font-body);
    font-size: 0.875rem;
    font-weight: 400;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    cursor: pointer;
    transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
  }
  .codestal-tab-btn.is-active,
  .codestal-tab-btn:hover {
    background: var(--c-white);
    color: var(--c-black);
    border-color: var(--c-white);
  }

  /* 12 列桌面网格 / 4 列移动网格（20px Gutter） */
  .codestal-grid {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    gap: 20px;
  }
  .codestal-card {
    grid-column: span 4;
    background-color: var(--c-charcoal);
    border: 1px solid var(--c-border);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    transition: border-color 0.25s ease;
  }
  .codestal-card:hover {
    border-color: var(--c-white);
  }
  .codestal-card[hidden] {
    display: none !important;
  }
  @media screen and (max-width: 1024px) {
    .codestal-card {
      grid-column: span 6;
    }
  }
  @media screen and (max-width: 600px) {
    .codestal-grid {
      grid-template-columns: repeat(4, 1fr);
      gap: 20px;
    }
    .codestal-card {
      grid-column: span 4;
    }
  }

  /* 卡片顶部：系列名 + 档案货号 + 克重 */
  .codestal-card-meta {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 14px 18px;
    border-bottom: 1px solid var(--c-border);
    font-size: 0.75rem;
    letter-spacing: 0.08em;
    color: #B8B8B8;
    text-transform: uppercase;
  }
  .codestal-weight-badge {
    color: var(--c-white);
    font-weight: 600;
    border: 1px solid var(--c-slate);
    padding: 2px 8px;
  }

  /* 商品黑白高反差微距图 */
  .codestal-img-wrap {
    position: relative;
    aspect-ratio: 1 / 1;
    background-color: #111111;
    overflow: hidden;
  }
  .codestal-img-wrap img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    filter: contrast(1.06);
    transition: transform 0.45s ease;
  }
  .codestal-card:hover .codestal-img-wrap img {
    transform: scale(1.04);
  }

  /* 卡片底部信息与双动作区 */
  .codestal-card-body {
    padding: 20px 18px;
  }
  .codestal-collection-tag {
    font-size: 0.75rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: #999999;
    margin: 0 0 6px;
  }
  .codestal-prod-title {
    font-size: 1.25rem;
    font-weight: 400;
    line-height: 1.2;
    color: var(--c-white);
    margin: 0 0 8px;
    text-transform: uppercase;
  }
  .codestal-finish-line {
    font-size: 0.875rem;
    font-weight: 300;
    color: #BBBBBB;
    margin: 0 0 18px;
  }
  .codestal-price-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-top: 16px;
    border-top: 1px solid var(--c-border);
    gap: 12px;
  }
  .codestal-price {
    font-family: var(--c-font-title);
    font-size: 1.25rem;
    color: var(--c-white);
  }
  .codestal-actions {
    display: flex;
    gap: 8px;
  }
  .codestal-btn-ghost {
    background: transparent;
    color: var(--c-white);
    border: 1px solid var(--c-slate);
    padding: 10px 14px;
    font-size: 0.75rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    cursor: pointer;
  }
  .codestal-btn-ghost:hover {
    border-color: var(--c-white);
  }
  .codestal-btn-solid {
    background: var(--c-white);
    color: var(--c-black);
    border: 1px solid var(--c-white);
    padding: 10px 16px;
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    text-decoration: none;
    cursor: pointer;
  }
  .codestal-btn-solid:hover {
    background: #CCCCCC;
    border-color: #CCCCCC;
  }

  /* 原案同款：Specifications / Warranty 快速规格抽屉弹窗 */
  .codestal-modal-backdrop {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.82);
    display: none;
    align-items: center;
    justify-content: center;
    z-index: 999;
    padding: 20px;
  }
  .codestal-modal-backdrop.is-open {
    display: flex;
  }
  .codestal-modal {
    background: var(--c-charcoal);
    border: 1px solid var(--c-slate);
    max-width: 560px;
    width: 100%;
    padding: 32px;
    color: var(--c-white);
    position: relative;
  }
  .codestal-modal-close {
    position: absolute;
    top: 20px;
    right: 20px;
    background: transparent;
    border: 1px solid var(--c-slate);
    color: var(--c-white);
    width: 32px;
    height: 32px;
    cursor: pointer;
  }
  .codestal-modal-tabs {
    display: flex;
    gap: 16px;
    border-bottom: 1px solid var(--c-slate);
    margin: 20px 0 16px;
  }
  .codestal-modal-tab {
    background: transparent;
    border: none;
    border-bottom: 2px solid transparent;
    color: #999999;
    padding: 8px 0;
    font-size: 0.8125rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    cursor: pointer;
  }
  .codestal-modal-tab.is-active {
    color: var(--c-white);
    border-bottom-color: var(--c-white);
  }
  .codestal-spec-dl {
    display: grid;
    grid-template-columns: 140px 1fr;
    row-gap: 10px;
    font-size: 0.875rem;
    margin: 0 0 24px;
  }
  .codestal-spec-dl dt {
    color: #999999;
    font-weight: 300;
  }
  .codestal-spec-dl dd {
    margin: 0;
    color: var(--c-white);
  }
</style>

<section class="codestal-sec-{{ section.id }}" data-section-id="{{ section.id }}">
  <div class="codestal-container">
    <div class="codestal-header">
      <div>
        <div class="codestal-slash-tag">\ {{ section.settings.slash_subtitle }} \</div>
        <h2 class="codestal-main-title">{{ section.settings.heading }}</h2>
      </div>
      <p class="codestal-manifesto">{{ section.settings.manifesto }}</p>
    </div>

    <div class="codestal-filter-bar">
      <div class="codestal-tabs" role="tablist" aria-label="按肌理与款式筛选">
        <button type="button" class="codestal-tab-btn is-active" data-filter="all">ALL ARCHIVE</button>
        <button type="button" class="codestal-tab-btn" data-filter="textured">TEXTURED</button>
        <button type="button" class="codestal-tab-btn" data-filter="minimal">MINIMAL</button>
        <button type="button" class="codestal-tab-btn" data-filter="fashion">FASHION</button>
        <button type="button" class="codestal-tab-btn" data-filter="ear-cuff">EAR CUFF</button>
      </div>
    </div>

    <div class="codestal-grid">
      {%- for block in section.blocks -%}
        {%- assign product = block.settings.product -%}
        {%- assign variant = product.selected_or_first_available_variant -%}
        {%- assign item_code = block.settings.item_code | default: variant.sku | default: 'UGS28\36\2023\1' -%}
        {%- assign item_weight = block.settings.weight_grams | default: variant.weight_in_unit | default: '4.10' -%}
        {%- assign item_title = block.settings.custom_title | default: product.title | default: 'FORGED METAL SILVER EARRINGS' -%}
        {%- assign item_price = product.price | money | default: block.settings.fallback_price -%}

        <article
          class="codestal-card"
          data-category="{{ block.settings.style_tag }}"
          {{ block.shopify_attributes }}
        >
          <div>
            <div class="codestal-card-meta">
              <span>ITEM: {{ item_code }}</span>
              <span class="codestal-weight-badge">WEIGHT: {{ item_weight }} g</span>
            </div>

            <div class="codestal-img-wrap">
              {%- if block.settings.custom_image != blank -%}
                <img
                  src="{{ block.settings.custom_image | image_url: width: 900 }}"
                  alt="{{ item_title | escape }}"
                  width="900"
                  height="900"
                  loading="lazy"
                >
              {%- elsif product != blank and product.featured_image != blank -%}
                <img
                  src="{{ product.featured_image | image_url: width: 900 }}"
                  alt="{{ item_title | escape }}"
                  width="900"
                  height="900"
                  loading="lazy"
                >
              {%- endif -%}
            </div>
          </div>

          <div class="codestal-card-body">
            <p class="codestal-collection-tag">\ {{ block.settings.collection_line }} \</p>
            <h3 class="codestal-prod-title">{{ item_title }}</h3>
            <p class="codestal-finish-line">{{ block.settings.material_spec }}</p>

            <div class="codestal-price-row">
              <span class="codestal-price">{{ item_price }}</span>
              <div class="codestal-actions">
                <button
                  type="button"
                  class="codestal-btn-ghost js-codestal-open-spec"
                  data-title="{{ item_title | escape }}"
                  data-code="{{ item_code | escape }}"
                  data-weight="{{ item_weight }} g"
                  data-material="{{ block.settings.material_spec | escape }}"
                  data-warranty="{{ block.settings.warranty_note | escape }}"
                  data-url="{{ product.url | default: '#' }}"
                >
                  SPECS +
                </button>
                <a href="{{ product.url | default: '#' }}" class="codestal-btn-solid">ADD TO BAG</a>
              </div>
            </div>
          </div>
        </article>
      {%- endfor -%}
    </div>
  </div>

  {%- comment -%} Specifications & Warranty 模态框 {%- endcomment -%}
  <div class="codestal-modal-backdrop" id="CodestalModal-{{ section.id }}" aria-hidden="true">
    <div class="codestal-modal" role="dialog" aria-modal="true">
      <button type="button" class="codestal-modal-close js-codestal-close" aria-label="Close">✕</button>
      <div class="codestal-slash-tag" id="ModalCode-{{ section.id }}">\ ITEM \</div>
      <h3 class="codestal-prod-title" id="ModalTitle-{{ section.id }}" style="font-family:var(--c-font-title);font-size:1.5rem;"></h3>

      <div class="codestal-modal-tabs">
        <button type="button" class="codestal-modal-tab is-active" data-modal-tab="specs">SPECIFICATIONS</button>
        <button type="button" class="codestal-modal-tab" data-modal-tab="warranty">WARRANTY & CARE</button>
      </div>

      <div id="ModalPaneSpecs-{{ section.id }}">
        <dl class="codestal-spec-dl">
          <dt>ARCHIVE NUMBER</dt>
          <dd id="ModalSpecCode-{{ section.id }}"></dd>
          <dt>EXACT WEIGHT</dt>
          <dd id="ModalSpecWeight-{{ section.id }}"></dd>
          <dt>MATERIAL & FINISH</dt>
          <dd id="ModalSpecMaterial-{{ section.id }}"></dd>
        </dl>
      </div>

      <div id="ModalPaneWarranty-{{ section.id }}" style="display:none;margin-bottom:24px;font-size:0.875rem;line-height:1.5;color:#CCCCCC;">
        <p id="ModalWarrantyText-{{ section.id }}"></p>
      </div>

      <a href="#" id="ModalBuyLink-{{ section.id }}" class="codestal-btn-solid" style="display:block;text-align:center;padding:14px;">
        ADD TO BAG
      </a>
    </div>
  </div>
</section>

<script>
  (function() {
    var sec = document.querySelector('.codestal-sec-{{ section.id }}');
    if (!sec) return;

    /* 顶部款式筛选 */
    var filterBtns = sec.querySelectorAll('[data-filter]');
    var cards = sec.querySelectorAll('.codestal-card');
    filterBtns.forEach(function(btn) {
      btn.addEventListener('click', function() {
        var cat = btn.getAttribute('data-filter');
        filterBtns.forEach(function(b) { b.classList.toggle('is-active', b === btn); });
        cards.forEach(function(card) {
          if (cat === 'all' || card.getAttribute('data-category') === cat) {
            card.removeAttribute('hidden');
          } else {
            card.setAttribute('hidden', 'hidden');
          }
        });
      });
    });

    /* Specifications / Warranty 弹窗控制 */
    var modal = sec.querySelector('#CodestalModal-{{ section.id }}');
    var openBtns = sec.querySelectorAll('.js-codestal-open-spec');
    var closeBtn = sec.querySelector('.js-codestal-close');
    var modalTabs = sec.querySelectorAll('[data-modal-tab]');
    var paneSpecs = sec.querySelector('#ModalPaneSpecs-{{ section.id }}');
    var paneWarranty = sec.querySelector('#ModalPaneWarranty-{{ section.id }}');

    openBtns.forEach(function(btn) {
      btn.addEventListener('click', function() {
        sec.querySelector('#ModalCode-{{ section.id }}').textContent = '\\ ' + btn.getAttribute('data-code') + ' \\';
        sec.querySelector('#ModalTitle-{{ section.id }}').textContent = btn.getAttribute('data-title');
        sec.querySelector('#ModalSpecCode-{{ section.id }}').textContent = btn.getAttribute('data-code');
        sec.querySelector('#ModalSpecWeight-{{ section.id }}').textContent = btn.getAttribute('data-weight');
        sec.querySelector('#ModalSpecMaterial-{{ section.id }}').textContent = btn.getAttribute('data-material');
        sec.querySelector('#ModalWarrantyText-{{ section.id }}').textContent = btn.getAttribute('data-warranty');
        sec.querySelector('#ModalBuyLink-{{ section.id }}').setAttribute('href', btn.getAttribute('data-url'));
        modal.classList.add('is-open');
      });
    });

    if (closeBtn) {
      closeBtn.addEventListener('click', function() { modal.classList.remove('is-open'); });
    }
    modal.addEventListener('click', function(e) {
      if (e.target === modal) modal.classList.remove('is-open');
    });

    modalTabs.forEach(function(tab) {
      tab.addEventListener('click', function() {
        var target = tab.getAttribute('data-modal-tab');
        modalTabs.forEach(function(t) { t.classList.toggle('is-active', t === tab); });
        paneSpecs.style.display = target === 'specs' ? 'block' : 'none';
        paneWarranty.style.display = target === 'warranty' ? 'block' : 'none';
      });
    });
  })();
</script>

{% schema %}
{
  "name": "CODESTAL 粗野主义银饰陈列柜",
  "tag": "section",
  "settings": [
    {
      "type": "text",
      "id": "slash_subtitle",
      "label": "顶部斜杠副标题",
      "default": "FORGED IN 925 STERLING SILVER"
    },
    {
      "type": "text",
      "id": "heading",
      "label": "Audiowide 主标题",
      "default": "REMEMBER YOUR ROOTS. PASS IT ON."
    },
    {
      "type": "textarea",
      "id": "manifesto",
      "label": "右侧品牌宣言",
      "default": "A manifesto of modern identity engraved in oxidized silver. Every dent and texture reflects manual forging traditions."
    },
    {
      "type": "range",
      "id": "padding_top",
      "min": 24,
      "max": 120,
      "step": 4,
      "unit": "px",
      "label": "顶部内边距",
      "default": 64
    },
    {
      "type": "range",
      "id": "padding_bottom",
      "min": 24,
      "max": 120,
      "step": 4,
      "unit": "px",
      "label": "底部内边距",
      "default": 64
    }
  ],
  "blocks": [
    {
      "type": "jewelry_item",
      "name": "银饰单品卡片",
      "settings": [
        {
          "type": "product",
          "id": "product",
          "label": "关联 Shopify 商品"
        },
        {
          "type": "image_picker",
          "id": "custom_image",
          "label": "自定义微距主图（可选）"
        },
        {
          "type": "text",
          "id": "custom_title",
          "label": "自定义商品标题",
          "default": "SILVER EARRINGS 'BOLDNESS'"
        },
        {
          "type": "text",
          "id": "collection_line",
          "label": "所属系列名称",
          "default": "FORGED METAL"
        },
        {
          "type": "select",
          "id": "style_tag",
          "label": "筛选分类标签",
          "options": [
            { "value": "textured", "label": "Textured（锻打肌理）" },
            { "value": "minimal", "label": "Minimal（极简几何）" },
            { "value": "fashion", "label": "Fashion（镶石造型）" },
            { "value": "ear-cuff", "label": "Ear Cuff（耳骨夹）" }
          ],
          "default": "textured"
        },
        {
          "type": "text",
          "id": "item_code",
          "label": "斜杠档案货号（留空则读取 SKU）",
          "default": "UGS28\\36\\2023\\1"
        },
        {
          "type": "text",
          "id": "weight_grams",
          "label": "单件克重 (g)",
          "default": "4.10"
        },
        {
          "type": "text",
          "id": "material_spec",
          "label": "材质与表面处理说明",
          "default": "925 Silver Forged Metal — Oxidized Finish"
        },
        {
          "type": "textarea",
          "id": "warranty_note",
          "label": "质保与氧化包浆说明（弹窗展示）",
          "default": "Hand-forged in 925 sterling silver. Oxidized finish is designed to naturally evolve and develop a personal patina over time. Includes 2-year structural warranty."
        },
        {
          "type": "text",
          "id": "fallback_price",
          "label": "示例价格（未绑商品时显示）",
          "default": "$260"
        }
      ]
    }
  ],
  "presets": [
    {
      "name": "CODESTAL 粗野主义银饰陈列柜",
      "blocks": [
        {
          "type": "jewelry_item",
          "settings": {
            "custom_title": "FORGED METAL SILVER EARRINGS",
            "collection_line": "FORGED METAL",
            "style_tag": "textured",
            "item_code": "UGS28\\36\\2023\\1",
            "weight_grams": "4.10",
            "material_spec": "925 Silver Forged Metal — Oxidized Finish",
            "fallback_price": "22 350 ₴"
          }
        },
        {
          "type": "jewelry_item",
          "settings": {
            "custom_title": "SILVER EARRINGS 'BOLDNESS'",
            "collection_line": "NEW SCALE",
            "style_tag": "fashion",
            "item_code": "CODE048",
            "weight_grams": "6.58",
            "material_spec": "925 Sterling Silver — Hand-Forged Texture",
            "fallback_price": "36 960 ₴"
          }
        },
        {
          "type": "jewelry_item",
          "settings": {
            "custom_title": "SILVER HOOP EARRINGS",
            "collection_line": "FORGED METAL",
            "style_tag": "minimal",
            "item_code": "UG52/40/071",
            "weight_grams": "4.10",
            "material_spec": "925 Sterling Silver — Brushed Matte",
            "fallback_price": "8 350 ₴"
          }
        }
      ]
    }
  ]
}
{% endschema %}

3. Compare four storefront design approaches