共享区块与系统页面区块
本文介绍你可以添加到任意页面类型的区块,以及每个系统页面附带的固定区块。关于如何添加和排列区块,请参阅 区块与块。
可添加到任意页面的区块
这些区块会出现在每种页面类型的添加选择器中。
文本
用于标题或段落的独立文本区块。每页最多 3 个。完整的排版设置记录在 布局组件 中。
图片
独立的图片区块。每页最多 3 个。可配置宽度(适应、填充或自定义百分比)、对齐方式、宽高比(自动、纵向、正方形或横向)、填充方式(覆盖或包含)、圆角、内边距,以及可选的点击跳转链接。
分隔线
一条分隔线。每页最多 10 个。可配置粗细、长度(容器的百分比)、端点样式、对齐方式、配色方案、宽度(适应或填充)和内边距。参见 布局组件。
社交媒体图标
一排独立的社交平台图标(每页一个)。外观可选 图标(可完全控制形状和配色)或 应用(每个平台显示为带品牌色的圆圈)。模式可选 内联(位于页面流中)或 固定(锚定在视口的左侧或右侧边缘,滚动时始终可见),并可选择在移动端回退为内联。支持的平台:Facebook、Instagram、Threads、X、TikTok、Snapchat、YouTube、LinkedIn、Pinterest、Tumblr、WhatsApp 和 Telegram,每个均以用户名形式输入(WhatsApp 以电话号码形式)。设置项:图标大小(12 至 64 px)、间距(0 至 48 px)、对齐方式、形状(无、圆形、圆角、方形)、填充样式(实心或描边)、容器大小(26 至 80 px)、配色(品牌色、单色或自定义十六进制颜色),以及悬停效果(无、品牌、缩放、上移、不透明度)。
自定义代码
用于原始 HTML、CSS 和 JavaScript 的区块(每项最多 5000 个字符,每页最多 2 个)。你的 HTML 会在一个唯一容器内渲染,你的 CSS 会自动限定到该容器从而无法影响其他区块,你的 JavaScript 会在一个隔离作用域中运行(容器会被传入),并在页面就绪后加载。适合用于第三方小部件和嵌入内容。
常见问题
一组问答对的折叠面板。可在 首页 和 产品 页面使用。可设置配色方案、宽度(页面或全宽)和内边距。
系统页面区块
每个系统页面都自带一个必需区块,用于定义其核心功能。这些区块无法删除,只能配置,不过你仍可以在它们周围添加文本、图片、分隔线和其他任意页面区块。
- 合集产品(合集页面):合集的产品网格。可配置桌面端列数、移动端列数(1 或 2)、间距、宽度、配色方案和产品卡片布局。
- 搜索产品(搜索页面):结果网格,使用与合集产品相同的网格和产品卡片控件。
- 联系(联系页面):一个包含姓名、邮箱、主题和留言字段的表单。可设置字段之间的间距、提交按钮的文案及其样式(主要或次要)。你可以在表单周围放置文本和分组块。
- 购物车(购物车页面):包含行项目、合计和结账入口的购物车。
- 结账(结账页面):包含客户和支付字段的结账流程。
- 订单确认(致谢页面):购买后的摘要,显示订单详情、客户信息、合计以及所选的配送和支付方式。
- 政策(政策页面):渲染你的法律页面内容(标题和正文)。你在商店设置中撰写政策文本;该区块仅控制其外观。
- 404(404 页面):页面未找到区块,包含一个标题、描述文本和一个返回首页的按钮。