Section

Product Comparison-v4

2 个模板实例,7 个 section 配置,1 类 block。

真实模板变体

Schema

{
  "name": "Product Comparison-v4",
  "class": "product-comparison-v4-section",
  "settings": [
    {
      "type": "text",
      "id": "heading",
      "label": "Heading",
      "default": "Comparison"
    },
    {
      "type": "range",
      "id": "visible_columns",
      "label": "Columns to display",
      "min": 1,
      "max": 4,
      "step": 1,
      "default": 3
    },
    {
      "type": "range",
      "id": "visible_specs",
      "label": "Spec rows shown before \"Show More\"",
      "min": 0,
      "max": 8,
      "step": 1,
      "default": 2
    },
    {
      "type": "text",
      "id": "show_more_text",
      "label": "Show more label",
      "default": "Show More"
    },
    {
      "type": "text",
      "id": "show_less_text",
      "label": "Show less label",
      "default": "Show Less"
    },
    {
      "type": "text",
      "id": "dom_id",
      "label": "DOM ID (optional)"
    },
    {
      "type": "range",
      "id": "max_width",
      "label": "Container max width",
      "min": 960,
      "max": 1800,
      "step": 10,
      "unit": "px",
      "default": 1310
    }
  ],
  "blocks": [
    {
      "type": "product",
      "name": "Product",
      "settings": [
        {
          "type": "product",
          "id": "product",
          "label": "Product",
          "info": "Used as the default source for title, image, color swatches, and primary button link."
        },
        {
          "type": "text",
          "id": "p_title",
          "label": "Custom product name (optional)",
          "info": "Overrides the selected product title in the dropdown."
        },
        {
          "type": "image_picker",
          "id": "p_image",
          "label": "Custom product image (optional)"
        },
        {
          "type": "text",
          "id": "swatches",
          "label": "Custom color swatches (optional)",
          "info": "Overrides product color options. Comma-separated colors, e.g. #b3a7e0,#ffffff,#000000"
        },
        {
          "type": "header",
          "content": "Buttons"
        },
        {
          "type": "text",
          "id": "shop_now_text",
          "label": "Primary button text",
          "default": "SHOP NOW"
        },
        {
          "type": "url",
          "id": "shop_now_url",
          "label": "Custom primary button URL (optional)"
        },
        {
          "type": "text",
          "id": "learn_more_text",
          "label": "Secondary button text",
          "default": "LEARN MORE"
        },
        {
          "type": "url",
          "id": "learn_more_url",
          "label": "Secondary button URL"
        },
        {
          "type": "header",
          "content": "Specs (icon + value)"
        },
        {
          "type": "image_picker",
          "id": "spec_icon_1",
          "label": "Spec 1 icon"
        },
        {
          "type": "text",
          "id": "spec_value_1",
          "label": "Spec 1 value",
          "default": "110,000 RPM"
        },
        {
          "type": "image_picker",
          "id": "spec_icon_2",
          "label": "Spec 2 icon"
        },
        {
          "type": "text",
          "id": "spec_value_2",
          "label": "Spec 2 value",
          "default": "22 m/s"
        },
        {
          "type": "image_picker",
          "id": "spec_icon_3",
          "label": "Spec 3 icon"
        },
        {
          "type": "text",
          "id": "spec_value_3",
          "label": "Spec 3 value"
        },
        {
          "type": "image_picker",
          "id": "spec_icon_4",
          "label": "Spec 4 icon"
        },
        {
          "type": "text",
          "id": "spec_value_4",
          "label": "Spec 4 value"
        },
        {
          "type": "image_picker",
          "id": "spec_icon_5",
          "label": "Spec 5 icon"
        },
        {
          "type": "text",
          "id": "spec_value_5",
          "label": "Spec 5 value"
        },
        {
          "type": "image_picker",
          "id": "spec_icon_6",
          "label": "Spec 6 icon"
        },
        {
          "type": "text",
          "id": "spec_value_6",
          "label": "Spec 6 value"
        },
        {
          "type": "image_picker",
          "id": "spec_icon_7",
          "label": "Spec 7 icon"
        },
        {
          "type": "text",
          "id": "spec_value_7",
          "label": "Spec 7 value"
        },
        {
          "type": "image_picker",
          "id": "spec_icon_8",
          "label": "Spec 8 icon"
        },
        {
          "type": "text",
          "id": "spec_value_8",
          "label": "Spec 8 value"
        }
      ]
    }
  ],
  "presets": [
    {
      "name": "Product Comparison-v4",
      "blocks": [
        {
          "type": "product",
          "settings": {
            "p_title": "Neo",
            "swatches": "#b3a7e0,#ffffff,#000000",
            "spec_value_1": "110,000 RPM",
            "spec_value_2": "22 m/s"
          }
        },
        {
          "type": "product",
          "settings": {
            "p_title": "Swift 4",
            "swatches": "#bdbdbd,#f0f0f0",
            "spec_value_1": "115,000 RPM",
            "spec_value_2": "23 m/s"
          }
        },
        {
          "type": "product",
          "settings": {
            "p_title": "SE Lite",
            "swatches": "#cdd9c9,#ffffff,#c9c2e6,#e6cfcf,#d9d2c4",
            "spec_value_1": "100,000 RPM",
            "spec_value_2": "19 m/s"
          }
        }
      ]
    }
  ]
}