跳至正文
帮助
编辑器版块与区块

如何添加带有轮换或滚动消息的公告栏?

为促销、免费配送或通知添加公告栏:最多添加 7 条消息,选择滑块(一次显示一条)或滚动条(连续滚动的一行),并设置消息间隔时间、分隔符、方向、字体大小、宽度、颜色和内边距。

阅读时间 3 分钟

公告栏是一条细长的横条,通常位于页面最顶部,用于显示“本周免费配送”或“支持货到付款”之类的简短消息。它可以显示一条消息,也可以轮换多条消息。

添加公告栏

  1. 打开建站工具,进入您想要的页面。
  2. 在版块标签中,点击添加新版块,在布局分组中选择公告栏。
  3. 如果想让它位于最顶部,把它拖到页头上方。
  4. 选择一个公告区块,在公告文本中输入您的消息。
  5. 点击发布。

任何页面上每页最多可以添加 2 个公告栏。每个页面都保存自己的副本。要在所有地方显示同一个公告栏,请使用应用到所有页面,请参阅版块和区块。

消息

每条消息都是一个公告区块。点击添加新区块即可添加,每个公告栏最多 7 个。拖动它们可以改变顺序。隐藏的消息和空消息会被跳过。只有一条消息时,它会居中静止显示。

动画设置

只有当公告栏中有两条或更多可见消息时,才会出现动画设置。

  • 模式:滑块一次显示一条消息,并带有用于前后切换的小箭头。滚动条把所有消息排成一行连续滚动。
  • 方向:左或右,即消息移动的方向。
  • 到下一条公告的时间:2 到 10 秒。在滑块模式下,它是每条消息停留的时间。在滚动条模式下,它设置速度:这一行文字滚过屏幕所需的时间,所以数字越大,滚动越慢。
  • 分隔符:放在消息之间的短字符或表情符号,例如圆点或星号。仅用于滚动条模式。

当顾客把鼠标指向它、触摸它或用键盘移到它上面时,滚动条会暂停,方便阅读。在设备上开启了减少动态效果的顾客会看到它静止不动。

布局和外观

  • 版块宽度:页面让消息保持在页面宽度内,全宽使用整个屏幕宽度。
  • 配色方案:公告栏的背景和文字颜色。与页头形成强烈对比,有助于公告栏更醒目。配色方案在配色方案中编辑。
  • 字体大小:10 到 30 像素。
  • 内边距:文字上方、下方和两侧的空白。
  • 自定义 CSS标签:仅用于此公告栏的您自己的样式。

创意

  • 两个公告栏:一个显示固定消息(例如您的配送承诺),另一个轮换显示各种优惠。
  • 简短的消息在屏幕较窄的手机上效果最好。
  • 季节性消息:优惠结束时用眼睛图标隐藏公告栏,下次再显示。它的消息会被保留。

小贴士

  • 找不到模式或分隔符:请先添加第二条消息。分隔符还要求模式设为滚动条。
  • 其他页面上没有这个公告栏:每个页面都有自己的版块。请在那里添加,或在已有公告栏的页面上使用“应用到所有页面”。

仍需帮助?

给我们留言,我们会回复你。

联系我们