Skip to main content
动态效果会为您的落地页添加动态叠加效果——例如在背景中飘动的粒子、沿卡片边框游走的光束,或是在按钮周围脉动的光晕。这些效果纯粹是视觉性的:它们以 pointer-events: none 渲染,因此永远不会阻挡对其下方内容的点击或轻触。

效果出现在哪些位置

设置全局效果

全局效果会同时应用于页面上的每一张卡片或每一个按钮(背景效果始终是全局的——因为只有一个背景)。
1

打开 Theme 面板

在构建器中打开您的页面后,点击顶部栏中的 Theme
2

在当前激活的主题上选择 Customise

在当前已应用的主题卡片上,点击 Customise。这会在右侧边栏打开 Customise · Global 面板。
3

展开 Effects 部分

向下滚动并点击 Effects 将其展开。您会看到三个下拉菜单:Background effectCard effectButton effect
4

选择一种效果

打开一个下拉菜单并选择一种具名效果。画布预览会立即以完整的视觉强度更新——与访客最终看到的效果完全一致。
Customise 面板的 Effects 部分显示 Background effect 设置为 Meteor Shower,页面标题区块后方的画布预览中可见对角线条纹

全局 Effects 面板,Meteor Shower 已应用为背景效果

5

发布以使其生效

效果在画布中与已发布页面上的渲染效果完全一致,因此没有其他需要配置的地方——准备好后直接发布即可。
要移除全局效果,打开同一个下拉菜单并选择 None (disabled)
打开的 Background effect 下拉菜单,列出 Preset default、None (disabled)、Meteor Shower、Particles 和 Animated Gradient

Background effect 下拉菜单,展示全部三种具名背景效果,以及 Preset default 和 None (disabled)

为单个区块覆盖效果

任何单个卡片或按钮区块都可以使用与全局设置不同的效果,或完全禁用效果,而不会改变其他区块的全局设置。
1

选中该区块

在画布中点击该区块,或从左侧的 Blocks 列表中选择它。
2

打开该区块的 Design 标签页

在右侧检查器中,点击 Design
3

展开 Effects 并选择一个选项

Effects 标题下,打开效果下拉菜单(根据区块类型不同,标注为 Card EffectButton Effect),然后选择:
  • Theme default —— 继承全局设置的当前值。这是每个区块的默认选项。
  • None (disabled) —— 仅关闭该区块的效果,即便全局设置中已应用了某个效果。
  • 任意具名效果 —— 覆盖全局设置,仅对该区块使用此效果。
区块 Design 标签页的 Effects 部分显示 Card Effect 下拉菜单已打开,选项包括 Theme default、None (disabled)、Border Beam、Shine Border 和 Neon Glow

某个区块自己的 Design 标签页,Card Effect 下拉菜单已打开

当页面上大多数卡片都应该带有效果,但其中一个——例如表单或免责声明——需要保持静态且易于阅读时,这个功能就很有用。

可用效果

背景效果

卡片效果

打开的 Card effect 下拉菜单,列出 Preset default、None (disabled)、Border Beam、Shine Border 和 Neon Glow

Card effect 下拉菜单

按钮效果

打开的 Button effect 下拉菜单,列出 Preset default、None (disabled)、Border Beam、Shine Border 和 Neon Glow

Button effect 下拉菜单

在全局 Customise 面板中,下拉菜单默认显示 Preset default(即您当前激活主题自带的效果),而不是 Theme default——后者这个标签专门用于区块级别的覆盖设置,表示”继承全局设置”。从功能上说,选择 None (disabled) 始终会关闭其作用范围内的效果。

画布预览与已发布页面对比

效果在画布构建器和已发布的落地页中都以完整的视觉强度渲染——您在编辑时看到的效果,就是访客会看到的效果。无需另外的”预览模式”来检查效果的呈现方式。

性能说明

效果非常轻量,且在客户端渲染,不会调用任何外部服务。它们完全在浏览器中运行,对页面加载时间的影响微乎其微。

相关内容

  • Themes —— 从 Customise 面板的 Effects 部分设置主题级默认效果。
  • Design options —— 覆盖全局设置的区块级 Effects 分组。
  • Blocks reference —— 携带 Card 或 Button 效果的区块。