Section

图文说明

18 个模板实例,26 个 section 配置,0 类 block。

真实模板变体

Schema

{
  "name": "图文说明",
  "class": "brush-large-image-text",
  "settings": [
    {
      "type": "header",
      "content": "Header"
    },
    {
      "type": "checkbox",
      "id": "stop_video_out",
      "label": "Stop video when out of view",
      "default": true
    },
    {
      "type": "text",
      "id": "margin_d",
      "label": "Custom margin (Desktop)",
      "info": "10px 0px 10px 0px"
    },
    {
      "type": "text",
      "id": "padding_d",
      "label": "Custom padding (Desktop)",
      "info": "10px 0px 10px 0px"
    },
    {
      "type": "text",
      "id": "margin_m",
      "label": "Custom margin (Mobile)",
      "info": "10px 0px 10px 0px"
    },
    {
      "type": "text",
      "id": "padding_m",
      "label": "Custom padding (Mobile)",
      "info": "10px 0px 10px 0px"
    },
    {
      "type": "checkbox",
      "id": "top_m",
      "label": "Reduce top margin (Tablet)",
      "default": false
    },
    {
      "type": "checkbox",
      "id": "bottom_m",
      "label": "Reduce bototm margin (Tablet)",
      "default": false
    },
    {
      "type": "checkbox",
      "id": "enable_min_height",
      "label": "Enable minimum height",
      "default": true
    },
    {
      "type": "checkbox",
      "id": "enable_video_height_m",
      "label": "Enable video height (Mobile)",
      "default": true
    },
    {
      "type": "color_background",
      "id": "section_bg_d",
      "label": "Section Background (Desktop)"
    },
    {
      "type": "color_background",
      "id": "section_bg_m",
      "label": "Section Background (Mobile)"
    },
    {
      "type": "color_background",
      "id": "bg",
      "label": "Background (Desktop)"
    },
    {
      "type": "color_background",
      "id": "bg_m",
      "label": "Background (Mobile)"
    },
    {
      "type": "color",
      "id": "h_color",
      "label": "Heading Color"
    },
    {
      "type": "color_background",
      "id": "h_color_bold",
      "label": "Bold Heading Color",
      "default": "#000"
    },
    {
      "type": "color",
      "id": "color",
      "label": "Color",
      "default": "#000000"
    },
    {
      "type": "checkbox",
      "id": "big_heading",
      "label": "Enable big font size",
      "default": false
    },
    {
      "type": "select",
      "id": "section_width",
      "options": [
        {
          "value": "grid",
          "label": "Grid"
        },
        {
          "value": "full-width-row",
          "label": "Full width"
        },
        {
          "value": "full-width-row-full",
          "label": "Full width, no spacing"
        }
      ],
      "default": "grid",
      "label": "Section width"
    },
    {
      "type": "image_picker",
      "id": "image",
      "label": "Main Image"
    },
    {
      "type": "checkbox",
      "id": "invert",
      "label": "Image on right"
    },
    {
      "type": "video",
      "id": "video",
      "label": "A Shopify-hosted video"
    },
    {
      "type": "checkbox",
      "id": "video_autoplay",
      "label": "Video autoplay",
      "default": true
    },
    {
      "type": "textarea",
      "id": "sub_heading",
      "label": "Sub Heading",
      "default": "INTUITIVE DESIGN",
      "info": "Leave empty if want to use image"
    },
    {
      "type": "html",
      "id": "heading",
      "label": "Heading",
      "default": "Durable aluminium alloy"
    },
    {
      "type": "richtext",
      "id": "content",
      "label": "Content",
      "default": "<p>In traditional hair dryer designs, the only way to check the temperature setting is to look at it directly. Now, Laifen is changing the brush and making the experience far more user-friendly. The 3-Color LED display indicates the temperature setting you're on, letting you know the temperature at a glance.</p>"
    }
  ],
  "blocks": [],
  "presets": [
    {
      "name": "图文说明"
    }
  ]
}