Section
Collection · Hero Banner
2 个模板实例,20 个 section 配置,0 类 block。
真实模板变体
Schema
{
"name": "Collection · Hero Banner",
"tag": "section",
"class": "section",
"settings": [
{
"type": "text",
"id": "section_id",
"label": "Section ID",
"default": "collection-hero-banner"
},
{
"type": "header",
"content": "Images"
},
{
"type": "image_picker",
"id": "image_d",
"label": "Background image (Desktop)"
},
{
"type": "image_picker",
"id": "image_m",
"label": "Background image (Mobile)"
},
{
"type": "header",
"content": "Text"
},
{
"type": "richtext",
"id": "heading",
"label": "Heading",
"default": "<p>Electric Toothbrush</p>"
},
{
"type": "select",
"id": "heading_tag",
"label": "Heading tag (SEO)",
"options": [
{
"value": "h1",
"label": "H1"
},
{
"value": "h2",
"label": "H2"
},
{
"value": "h3",
"label": "H3"
},
{
"value": "p",
"label": "Paragraph"
}
],
"default": "h2"
},
{
"type": "richtext",
"id": "subheading",
"label": "Subheading",
"default": "<p>Experience The World's Smartest Toothbrush Smart Pressure Sensor. Custom Modes. Guided Brushing.</p>"
},
{
"type": "header",
"content": "Layout & Colors"
},
{
"type": "select",
"id": "content_align",
"label": "Content horizontal position",
"options": [
{
"value": "flex-start",
"label": "Left"
},
{
"value": "center",
"label": "Center"
},
{
"value": "flex-end",
"label": "Right"
}
],
"default": "flex-start"
},
{
"type": "select",
"id": "content_vertical_desktop",
"label": "Content vertical position (Desktop)",
"options": [
{
"value": "flex-start",
"label": "Top"
},
{
"value": "center",
"label": "Middle"
},
{
"value": "flex-end",
"label": "Bottom"
}
],
"default": "center"
},
{
"type": "select",
"id": "content_vertical_mobile",
"label": "Content vertical position (Mobile)",
"options": [
{
"value": "flex-start",
"label": "Top"
},
{
"value": "center",
"label": "Middle"
},
{
"value": "flex-end",
"label": "Bottom"
}
],
"default": "flex-end"
},
{
"type": "select",
"id": "text_align",
"label": "Text alignment",
"options": [
{
"value": "left",
"label": "Left"
},
{
"value": "center",
"label": "Center"
},
{
"value": "right",
"label": "Right"
}
],
"default": "left"
},
{
"type": "range",
"id": "content_max_width",
"label": "Content max width",
"min": 320,
"max": 900,
"step": 10,
"unit": "px",
"default": 520
},
{
"type": "range",
"id": "container_max_width",
"label": "Container max width",
"min": 960,
"max": 1600,
"step": 10,
"unit": "px",
"default": 1310
},
{
"type": "range",
"id": "min_height_desktop",
"label": "Min height (Desktop)",
"min": 200,
"max": 700,
"step": 10,
"unit": "px",
"default": 320
},
{
"type": "range",
"id": "min_height_mobile",
"label": "Min height (Mobile)",
"min": 160,
"max": 600,
"step": 10,
"unit": "px",
"default": 280
},
{
"type": "color",
"id": "heading_color",
"label": "Heading color",
"default": "#ffffff"
},
{
"type": "color",
"id": "text_color",
"label": "Subheading color",
"default": "#ffffff"
},
{
"type": "text",
"id": "aria_label",
"label": "Accessibility label",
"default": "Collection hero banner"
}
],
"blocks": [],
"presets": [
{
"name": "Collection · Hero Banner"
}
]
}