Section
Sticky Navigation
8 个模板实例,50 个 section 配置,7 类 block。
真实模板变体
page.air-landingsticky-nav · 5 blocks启用page.campaign-homelaifen_sticky_navigation_btEQnF · 5 blocks启用page.electric-shaverssticky_navigation_tVGFCY · 6 blocks启用page.hair-recommendationsticky_navigation · 4 blocks启用page.laifen-dealslaifen_sticky_navigation_GPMU7R · 0 blocks已禁用page.laifen-toothbrush-secondsticky_navigation_tVGFCY · 7 blocks启用page.p3-pro-product-landingsticky_navigation_tVGFCY · 5 blocks启用page.t1-pro-product-landingsticky_navigation_tVGFCY · 6 blocks启用
Schema
{
"name": "Sticky Navigation",
"settings": [
{
"type": "text",
"id": "section_id",
"label": "Section ID",
"default": "sticky-navigation"
},
{
"type": "text",
"id": "product_title",
"label": "Product Title",
"default": "Product Name"
},
{
"type": "image_picker",
"id": "product_image",
"label": "Product Image"
},
{
"type": "header",
"content": "Button 1"
},
{
"type": "text",
"id": "button_1_text",
"label": "Button 1 Text",
"default": "Buy Now"
},
{
"type": "url",
"id": "button_1_link",
"label": "Button 1 Link"
},
{
"type": "checkbox",
"id": "button_1_show_dropdown",
"label": "Button 1 Show Product Dropdown",
"default": true
},
{
"type": "color",
"id": "button_1_background",
"label": "Button 1 Background",
"default": "#ffffff"
},
{
"type": "color",
"id": "button_1_text_color",
"label": "Button 1 Text Color",
"default": "#000000"
},
{
"type": "color",
"id": "button_1_border_color",
"label": "Button 1 Border Color",
"default": "#000000"
},
{
"type": "text",
"id": "button_1_border_width",
"label": "Button 1 Border Width",
"default": "1px",
"info": "e.g. 1px, 2px, 0px"
},
{
"type": "text",
"id": "button_1_border_radius",
"label": "Button 1 Border Radius",
"default": "24px",
"info": "e.g. 24px, 12px, 0px"
},
{
"type": "color",
"id": "button_1_hover_background",
"label": "Button 1 Hover Background",
"default": "#ffffff"
},
{
"type": "color",
"id": "button_1_hover_text_color",
"label": "Button 1 Hover Text Color",
"default": "#007bff"
},
{
"type": "color",
"id": "button_1_hover_border_color",
"label": "Button 1 Hover Border Color",
"default": "#007bff"
},
{
"type": "color_background",
"id": "button_1_background_gradient",
"label": "Button 1 Background Gradient",
"default": "linear-gradient(90deg,#ffffff,#ffffff)",
"info": "CSS gradient string, e.g. linear-gradient(90deg,#000000,#FFFFFF)"
},
{
"type": "color_background",
"id": "button_1_hover_background_gradient",
"label": "Button 1 Hover Background Gradient",
"default": "linear-gradient(90deg,#ffffff,#ffffff)",
"info": "CSS gradient string for hover, e.g. linear-gradient(90deg,#000000,#FFFFFF)"
},
{
"type": "header",
"content": "Button 2"
},
{
"type": "text",
"id": "button_2_text",
"label": "Button 2 Text"
},
{
"type": "url",
"id": "button_2_link",
"label": "Button 2 Link"
},
{
"type": "checkbox",
"id": "button_2_show_dropdown",
"label": "Button 2 Show Product Dropdown",
"default": false
},
{
"type": "color",
"id": "button_2_background",
"label": "Button 2 Background",
"default": "#000000"
},
{
"type": "color",
"id": "button_2_text_color",
"label": "Button 2 Text Color",
"default": "#ffffff"
},
{
"type": "color",
"id": "button_2_border_color",
"label": "Button 2 Border Color",
"default": "transparent"
},
{
"type": "text",
"id": "button_2_border_width",
"label": "Button 2 Border Width",
"default": "0px",
"info": "e.g. 1px, 2px, 0px"
},
{
"type": "text",
"id": "button_2_border_radius",
"label": "Button 2 Border Radius",
"default": "24px",
"info": "e.g. 24px, 12px, 0px"
},
{
"type": "color",
"id": "button_2_hover_background",
"label": "Button 2 Hover Background",
"default": "#5a9bff"
},
{
"type": "color",
"id": "button_2_hover_text_color",
"label": "Button 2 Hover Text Color",
"default": "#ffffff"
},
{
"type": "color",
"id": "button_2_hover_border_color",
"label": "Button 2 Hover Border Color",
"default": "transparent"
},
{
"type": "color_background",
"id": "button_2_background_gradient",
"label": "Button 2 Background Gradient",
"default": "linear-gradient(90deg,#000000,#000000)",
"info": "CSS gradient string, e.g. linear-gradient(90deg,#000000,#FFFFFF)"
},
{
"type": "color_background",
"id": "button_2_hover_background_gradient",
"label": "Button 2 Hover Background Gradient",
"default": "linear-gradient(90deg,#5a9bff,#5a9bff)",
"info": "CSS gradient string for hover, e.g. linear-gradient(90deg,#000000,#FFFFFF)"
},
{
"type": "header",
"content": "Button 3"
},
{
"type": "text",
"id": "button_3_text",
"label": "Button 3 Text"
},
{
"type": "text",
"id": "button_3_code",
"label": "Button 3 Form Code"
},
{
"type": "checkbox",
"id": "button_3_show_dropdown",
"label": "Button 3 Show Product Dropdown",
"default": false
},
{
"type": "color",
"id": "button_3_background",
"label": "Button 3 Background",
"default": "#000000"
},
{
"type": "color",
"id": "button_3_text_color",
"label": "Button 3 Text Color",
"default": "#ffffff"
},
{
"type": "color",
"id": "button_3_border_color",
"label": "Button 3 Border Color",
"default": "transparent"
},
{
"type": "text",
"id": "button_3_border_width",
"label": "Button 3 Border Width",
"default": "0px",
"info": "e.g. 1px, 2px, 0px"
},
{
"type": "text",
"id": "button_3_border_radius",
"label": "Button 3 Border Radius",
"default": "24px",
"info": "e.g. 24px, 12px, 0px"
},
{
"type": "color",
"id": "button_3_hover_background",
"label": "Button 3 Hover Background",
"default": "#5a9bff"
},
{
"type": "color",
"id": "button_3_hover_text_color",
"label": "Button 3 Hover Text Color",
"default": "#ffffff"
},
{
"type": "color",
"id": "button_3_hover_border_color",
"label": "Button 3 Hover Border Color",
"default": "transparent"
},
{
"type": "color_background",
"id": "button_3_background_gradient",
"label": "Button 3 Background Gradient",
"default": "linear-gradient(90deg,#000000,#000000)",
"info": "CSS gradient string, e.g. linear-gradient(90deg,#000000,#FFFFFF)"
},
{
"type": "color_background",
"id": "button_3_hover_background_gradient",
"label": "Button 3 Hover Background Gradient",
"default": "linear-gradient(90deg,#5a9bff,#5a9bff)",
"info": "CSS gradient string for hover, e.g. linear-gradient(90deg,#000000,#FFFFFF)"
},
{
"type": "header",
"content": "Colors"
},
{
"type": "color",
"id": "background_color",
"label": "Background Color",
"default": "#ffffff"
},
{
"type": "color",
"id": "text_color",
"label": "Text Color",
"default": "#000000"
},
{
"type": "color",
"id": "active_color",
"label": "Active Link Color",
"default": "#181623"
},
{
"type": "color",
"id": "dropdown_background",
"label": "Dropdown Background",
"default": "#ffffff"
}
],
"blocks": [
{
"type": "nav_item",
"name": "Navigation Item",
"settings": [
{
"type": "text",
"id": "title",
"label": "Title",
"default": "Overview"
},
{
"type": "url",
"id": "link",
"label": "Link"
}
]
},
{
"type": "channel_link",
"name": "Channel Link",
"settings": [
{
"type": "text",
"id": "title",
"label": "Title",
"default": "Shop"
},
{
"type": "image_picker",
"id": "logo",
"label": "Logo Image"
},
{
"type": "url",
"id": "link",
"label": "Link"
}
]
},
{
"type": "products_list",
"name": "Products List",
"settings": [
{
"type": "image_picker",
"id": "product_image",
"label": "Product Image"
},
{
"type": "text",
"id": "title",
"label": "Title"
},
{
"type": "url",
"id": "link",
"label": "Link"
}
]
},
{
"type": "nav_item_2",
"name": "Navigation Item 2",
"settings": [
{
"type": "text",
"id": "title",
"label": "Title",
"default": "Overview"
},
{
"type": "url",
"id": "link",
"label": "Link"
}
]
},
{
"type": "nav_item_3",
"name": "Navigation Item 3",
"settings": [
{
"type": "text",
"id": "title",
"label": "Title",
"default": "Overview"
},
{
"type": "url",
"id": "link",
"label": "Link"
}
]
},
{
"type": "nav_item_4",
"name": "Navigation Item 4",
"settings": [
{
"type": "text",
"id": "title",
"label": "Title",
"default": "Overview"
},
{
"type": "url",
"id": "link",
"label": "Link"
}
]
},
{
"type": "nav_item_5",
"name": "Navigation Item 5",
"settings": [
{
"type": "text",
"id": "title",
"label": "Title",
"default": "Overview"
},
{
"type": "url",
"id": "link",
"label": "Link"
}
]
}
],
"presets": [
{
"name": "Sticky Navigation",
"blocks": [
{
"type": "nav_item",
"settings": {
"title": "Overview",
"link": "#overview"
}
},
{
"type": "nav_item",
"settings": {
"title": "Features",
"link": "#features"
}
},
{
"type": "nav_item",
"settings": {
"title": "Specs",
"link": "#specs"
}
},
{
"type": "nav_item",
"settings": {
"title": "Comparison",
"link": "#comparison"
}
}
]
}
]
}