悬浮窗口为何依然有效
网页空间有限，当联系表单、视频或产品详情与主内容争夺版面时，页面容易显得杂乱。单独开一个页面能解决拥堵，但会打断用户的浏览心流，导致其在决策关键时刻流失。悬浮弹窗允许访客在当前页面直接获取报价、观看视频或对比方案，无需跳转。其有效性取决于内容与触发时机的匹配度，比如说展示团队介绍与自动弹出的促销广告目的截然不同。设计一致性也很关键，每个悬浮层都基于 Divi 布局构建，其字体、色彩与间距能与站点风格无缝衔接，避免产生割裂感。
Divi Overlays 核心机制
该插件将每个弹窗视为独立的 Divi 布局，通过自定义文章类型管理。用户可利用视觉构建器设计无限数量的弹窗，并在整个站点复用。修改一个弹窗无需重建所有关联页面。触发方式灵活，既包括文本链接、按钮、模块甚至菜单项等点击元素，也涵盖延时、滚动百分比及离站意向等自动规则，还支持直接通过 URL 链接访问。
主要功能拆解
利用 Divi 构建器设计内容
在弹窗内部，完整的 Divi 模块与控制项均可使用。简单的联系表单只需标题加表单模块；复杂的促销页可容纳价格表、轮播图或视频。专业场景如多步骤表单或购物车，则依赖站点已安装的相关插件。由于弹窗本身是 Divi 页面，其样式天然继承站点全局设置，不会像第三方小部件那样突兀。
触发机制详解
手动点击触发
这是最直接的展示方式。在 Divi 5 中，需复制弹窗的 CSS 类名，并将其添加到触发元素（如按钮）的高级属性中作为类名。此后，点击该元素即可打开弹窗，适用于需按需查看的内容。
自动触发设置
在弹窗设置的“Triggers”标签页中，可通过“Automatic Trigger”下拉菜单配置延时、滚动或离站等自动行为。
模板与显示类型
插件提供多种预设模板，并支持不同显示位置与尺寸的悬浮层，适配移动端与桌面端的不同需求。
实操步骤：创建团队介绍弹窗
新建并配置弹窗
在后台新建 Divi Overlay，命名后进入编辑。在设置中配置触发方式与显示范围，确定其适用的页面或全站。
构建布局
使用 Divi 视觉构建器添加文本、图像与按钮模块，设计团队介绍的内容结构，调整样式以符合品牌规范。
绑定触发器
回到触发该弹窗的页面（如首页），选中“关于我们”按钮，在高级设置中填入刚获取的弹窗 CSS 类名。保存后，点击按钮即弹出悬浮层。
适用人群
需要频繁更新弹出内容、希望保持页面整洁且不愿编写复杂 JS 代码的 Divi 用户。无论是电商店主、内容创作者还是企业官网维护者，都能通过此插件管理交互细节。
