横幅内容和元素
横幅可以包含的六种元素、如何排序,以及如何通过分组让一个横幅传达两条信息。
Content 面板是构建器侧栏中的第一个图标。横幅所说的所有内容都在这里设置。

元素在横幅中从左到右排列,顺序与它们在此列表中的顺序一致。
- Add element 会打开包含六种类型的菜单。新元素会添加到列表末尾。
- 拖动行左侧的手柄可移动该元素。横幅会按这里的顺序排列。
- 将鼠标悬停在行上,会显示复制和删除按钮。
- 点击某一行,即可在右侧一栏中打开它的设置。
消息本身。可设置文字内容、大小、粗体、斜体、下划线以及它自己的颜色。
如果颜色留空,文字会沿用横幅自身的文字颜色,因此重新设置横幅样式时,消息也会随之改变。
Countdown
Section titled “Countdown”横幅内的实时计时器。它有三种模式:
| 模式 | 买家看到的内容 |
|---|---|
| Count down to a date | 所有人看到相同的剩余时间 |
| Fixed minutes per visitor | 每位买家在到达时获得自己的计时 |
| Daily recurring | 在选定的工作日、两个时间之间运行 |
您还可以选择显示哪些单位(天、小时、分钟、秒)、是否在数字下方显示单位说明,以及说明的文字。说明留空则使用英文默认值。
When the timer ends 决定归零时的处理方式:隐藏横幅、保持在零,或重新开始。
Button
Section titled “Button”一个标签加一个操作:
| 点击时 | 作用 |
|---|---|
| Open a link | 将买家带到某个网址 |
| Scroll to a section | 通过 CSS 选择器跳转到当前页面的某个部分 |
| Apply a discount code | 将折扣码应用到买家的购物车 |
对于链接,您还可以开启 Open in a new tab,这样您的商店会保留在后台。
其余是样式设置:形状(方形、圆角、胶囊形)、字号、尺寸预设、粗体/斜体/下划线、背景、标签颜色和边框。
Discount code
Section titled “Discount code”折扣码本身,以虚线轮廓显示。开启 Copy on click 后,买家点击它即可复制,无需选中,也无需输入。
可以设置它的边框样式、圆角半径和专属颜色。
标志或徽章。粘贴网址,或上传文件,字段会自动填入。设置高度和替代文字。
替代文字是屏幕阅读器朗读的内容,也是图片加载失败时显示的内容。
Line break
Section titled “Line break”没有可见内容。它之后的所有内容会另起一行,因此较长的横幅可以分为两行显示,而不是挤在一行。
将它拖到两个元素之间,即可在您想要的位置拆分横幅。
一个元素,两种屏幕
Section titled “一个元素,两种屏幕”打开除换行以外的任何元素,它的 Style 部分以 Device settings 开头,有三个图标:眼睛、桌面和手机。

Device settings 位于 Style 的顶部,其下的所有设置都跟随您选择的图标。
眼睛是常规情况:您设置的内容同时适用于两种屏幕。
桌面和手机图标会将其下的设置限定在该屏幕。选择手机并将字号降到 12,则只有手机会使用 12,桌面端仍保持眼睛图标所设置的值。Style 中的所有设置都可以这样拆分:字号、倒计时的数字和标签大小、颜色及其显示的单位、图片高度、按钮的形状和大小、折扣码的边框和颜色。
选择某种屏幕还会显示 Hide on desktop 或 Hide on mobile 开关。通过它,您可以去掉不适合手机的元素(例如长句或图片),而无需另建一个横幅。该元素仍会在另一种屏幕上显示。
换行没有 Style 部分,因此保留一个简单的 Show on 控件:Both screens、Desktop only 或 Mobile only。
分组:一个横幅,两条消息
Section titled “分组:一个横幅,两条消息”元素列表下方是 Add group。
只有一个分组是常规情况。再添加第二个,横幅就会在它们之间循环:先显示第一个分组,然后是第二个,再回到第一个。每个分组包含各自的元素,因此一个横幅可以交替显示“Free shipping over $50”和“Sale ends tonight”。
切换的速度,以及是交叉淡入淡出还是滑动,请参阅动画和分组。