告别逐个修改:Divi 5 多选与批量编辑实战指南

在网站建设中,反复调整相同类型的元素特别耗时,尤其是当这些元素需要统一的设计参数时。Divi 5 引入的多选(Multi-Select)和批量编辑(Bulk Editing)功能,允许用户同时选中多个元素,统一更改其设置或对选中项执行批量操作。

本文解释选区的构建方式、混合值(Mixed values)的含义,和当不同类型模块被同时选中时批量设置的行为逻辑。随后通过一个会议议程的案例,演示如何在不逐个编辑每个会话的情况下,统一更新背景、间距和响应式设置。

Divi 5 中的多选与批量编辑定义

多选功能允许在构建器中选中多个元素。批量编辑则允许对选区内的设置做统一修改,或对选区元素执行集体操作。比如说,选中三行布局(Rows)后,可为它们赋予相同的背景色,调整内边距(Padding),添加手机端专用数值,甚至一起复制选中的行。需要注意的是,选区本身不会在元素间建立永久性的关联关系。清除选区后,每个元素仍可独立编辑。若需复用样式或保持元素连接,预设(Presets)和组件(Components)是更合适的工具,而非批量编辑。

构建选区的具体操作

选区可以在画布或图层面板中构建。图层面板在需要精确选中特定行、列或嵌套模块,且避免误选父级元素时尤为实用。

  • Windows 按 Ctrl+点击 / Mac 按 Cmd+点击:将单个元素加入或移除选区。对已选元素重复此操作可将其从选区中剔除。
  • Shift+点击:选中共享同一父级的兄弟元素范围。
  • Ctrl/Cmd+A:当指针位于画布上的某个模块时,选中其容器内的所有元素。这不会强制选中整页。
  • Ctrl/Cmd+D:清除当前多选状态。

上述快捷键在画布操作时生效。若焦点在文本输入框内,Ctrl/Cmd+A 等快捷键将作用于框内文本而非画布元素。

批量设置如何处理不同数值

做批量编辑前,所选元素无需拥有完全相同的设置。当数值存在差异时,受支持的控件会显示混合(Mixed)状态。这并非错误,而是提示选区内该设置包含多个不同值。输入新数值后,该值将应用于支持该控件的所有选中元素。不同类型的模块也能被同时选中,其合并设置面板会显示适用于所有类型的公共控件,和仅适用于部分类型的专属控件。某一类模块特有的设置,不会自动应用到其他类型的模块上。区分设计设置与内容修改至关重要。更新背景色不会替换选中的标题或描述文本;但批量编辑内容字段时,会直接替换目标元素上的现有内容。

选区的其他应用场景

除了设置面板,选区还适用于以下工具:

  • 预设:在兼容的选中元素间分配或移除预设。元素预设应用于匹配的模块类型;选项组预设则作用于拥有该选项组的元素。
  • 检查器(Inspector):从构建器工具栏打开,用于查看选中元素及其子元素,编辑限制在该选区内做。
  • Divi AI 代理:选中的元素会作为范围芯片(scope chips)显示在消息框上方,可一次性请求对这些元素做调整。
  • 移动与分组:将选中元素拖拽至兼容目标。要将选中模块包裹在组模块中,使用 Ctrl/Cmd+G 做分组。

官方文档涵盖了这些工作流的详细限制。下文案例将聚焦于选区构建、共享设置及可直观检查的操作。

案例演示:会议议程布局

本案例使用一个包含排版头部和三个会话行的会议议程。每个会话包含编号、时间、标题、描述和按钮。起始文件中,各行背景不同,以便观察混合状态;下载包中亦包含完成后的结果以供对比。通过统一背景色、调整间距及添加手机专用内边距,无需逐个操作即可完成布局规范化。

批量编辑的注意事项

在批量操作中,需留意模块类型差异对控件可见性的影响。内容字段的批量修改具有覆盖性,操作前应确认选区范围是不是符合预期。混合状态提示数值不统一,是批量应用新值的最佳时机。

发表评论