WordPress divi主题

Divi 的后端编辑器中现在提供的所有新功能的实用概述

by | May 16, 2022 | Divi主题使用教程 | 0 comments

5分钟生成10篇英文软文article forge软件试用

Divi 的新后端编辑器是一项全新功能,将视觉构建器的强大功能带入后端。 新的后端编辑器具有熟悉的界面(如经典构建器),但具有以前经典构建器不可用的所有新功能。 我们了解任何更改(无论大小)都需要对您通常的工作流程进行一些调整。 在本教程中,我将亲身体验 Divi 后端编辑器中现在可用的所有新功能。 我认为您会对这些改进感到惊讶,并很高兴在您的下一个项目中尝试它们。

google广告开户

以下是我们将在本教程中介绍的功能的细分:

  1. 新的页面编辑器 UI
  2. 速度
  3. 具有 100% 准确页面渲染的查看模式
  4. 新的生成器菜单结构
  5. 生成器设置
  6. 在页面之间复制和粘贴 Divi 元素
  7. 过滤搜索
  8. 快速访问
  9. 色彩管理器和魔幻色彩建议
  10. 查找和替换
  11. 扩展样式
  12. 拖放文件上传
  13. 动态内容
  14. 悬停选项
  15. 批量编辑和多选

访问新的 Divi 后端编辑器

新的 Divi Builder 体验 (Divi 3.18) 包括本文中讨论的新 Divi 后端编辑器功能。 它的发布是为了与最近发布的 WordPress 5.0 顺利集成。 有关如何使用 WordPress 5.0 访问新的 Divi Builder 体验的更多信息,请查看这篇文章。

现在让我们来看看那些很棒的功能!

#1 新的 Divi 后端编辑器 UI

新的 Divi Builder 后端有一些新元素,您可能需要先熟悉这些元素。 在大多数情况下,事情看起来很熟悉,但有一些重要的区别。

  • “Use the Visual Builder”按钮已被“Build on the Front End”按钮取代。 这只是措辞上的变化。 该按钮将允许您在前端设计页面,就像过去的 Visual Builder 一样。
  • 视图模式现在在后端可用(稍后会详细介绍)。
  • 新的 Divi Builder UI,默认为线框视图模式。
  • 链接到切换回经典 Divi Builder。 这使您可以在经典的 Divi 构建器和新的 Divi 构建器之间来回切换。

#2 速度

速度是很难在帖子中向您展示的功能之一,但它对工作流程非常重要,我想我会在这里提到它。 你们中的一些人过去可能避免使用 Visual Builder,因为它不如 Classic Backend Builder 快。 但是现在您可以在后端和前端享受更快的视觉构建体验,这可以通过缓存利用实现。 亲自去看看吧!

#3 具有 100% 准确页面渲染的视图模式

新的 Divi 后端编辑器上的视图模式可让您快速从默认线框视图模式切换到其他视图模式(桌面、平板电脑、智能手机和缩小),为您在后端提供视觉构建体验。

这是您在每个视图模式之间切换时的样子。

WordPress divi主题

线框视图模式

这基本上用内置的所有 Visual Builder 功能替换了经典的 Divi 后端构建器。这也是一个很好的故障安全视图,用于编辑具有大量自定义或自定义代码的页面,这会使某些元素难以在一种视觉模式下编辑. 例如,如果您有重叠的元素,则可能难以访问元素的设置菜单。 因此,您需要做的就是切换到线框视图模式,打开该元素的设置模式,然后切换回以可视方式编辑元素。

缩小视图模式

此视图模式允许您从更广泛的角度直观地编辑您的页面。 它使您无需在新浏览器中加载即可查看页面的整体设计。 它允许您更轻松地移动较大的元素(如部分或行)。 另外,如果您使用多选和查找和替换等功能在整个页面中进行设计调整,这将允许您实时查看这些更改,而无需滚动太多。

桌面视图模式

此视图是您将在后端进行大部分可视化构建器编辑的地方。 视图模式跨越了构建器的整个宽度。 由于构建器视图几乎覆盖了浏览器的整个宽度,因此您可以在后端对页面进行准确的桌面描述。

平板电脑查看模式

平板电脑视图以 768 像素宽(平板电脑的常见纵向)显示您的页面外观。

智能手机查看模式

智能手机查看模式可让您准确描绘 479 像素宽的页面(智能手机常见的纵向)

fiverr建站WordPress程序员

新的菜单结构在一个方便紧凑的地方包含了所有选项。 最右边还有一个新的 Builder Settings 选项,该选项直到现在才在后端可用(更多内容见下文)。

#5 生成器设置

新的构建器设置现在在后端构建器上可用。 这个强大的功能允许您自定义您的构建器体验以适应您自己的工作流程。

所有这些选项都可以方便地设置您希望 Divi 默认工作的方式。 以下是一些可能会让您感到惊讶的选项。

独立站选品工具

使用悬停模式、单击模式和网格模式选项自定义构建器设置工具栏

在其中一种可视视图模式(如桌面视图模式)中编辑后端页面时,您可以使用此选项从工具栏中添加或删除项目。 您甚至可以将悬停模式(默认交互)、单击模式和网格模式添加到您的工具栏,以便您随时更改与 Divi 交互的方式。

在悬停模式(默认交互模式)下,悬停在模块、行和部分上会显示它们的控件,然后可以单击这些控件。

在单击模式下,当您单击一个元素而不是将鼠标悬停在该元素上时会显示控件。 单击元素后,其控件将保持可见,直到您单击其他内容或退出为止。 单击模式还突出显示悬停时的元素,这对于识别页面上的小模块非常有帮助。

高质量外链购买

在网格模式下,页面上的所有模块、行和部分控件都会一次显示。

甚至还有一个选项可以在 Builder 设置下设置默认的完整模式。

优化页面创建流程

您可以优化页面创建流程以满足您的需求。 例如,您可以将页面创建流程设置为始终从头开始构建新页面,而不是每次创建新页面时都提示您选择页面创建方法。

JasperAI 10000字免费额度试用

现在,当您创建新页面并部署 Divi Builder 时,您将直接从头开始编辑页面,从而在开发新站点期间节省一些宝贵的时间。

您还可以在功能博客文章中阅读有关这些 Builder 设置的更多信息。

#6 在页面之间复制和粘贴 Divi 元素

现在您可以从一个页面复制整个 Divi 元素或样式并将它们粘贴到一个完全不同的页面中。 这可以在构建网站时为您节省大量时间。 无需将元素保存到 divi 库并将其导入新页面,您需要做的就是复制并粘贴它!

过滤搜索是过去仅在 Visual Builder 上可用的出色设计效率改进之一。

WordPress备份工具updrafplus

这使您可以在设置模式的顶部输入搜索查询,以更快地找到某个选项。 您可以选择某些过滤器来显示修改后的样式、响应式样式、悬停样式和活动内容。 您甚至可以将搜索查询与过滤器结合起来进行更有针对性的搜索。

例如,您可以在设置模式的搜索栏中输入“字体”一词,以显示所有与字体相关的设计选项。 然后,您可以结合搜索查询添加过滤器“已修改样式”,以显示所有已修改样式的字体选项。

这是检查您自己设计的设计选项以及许多可用的预制布局设计的一种快速简便的方法。 其他过滤器包括响应式样式(为平板电脑和智能手机设置的值)、悬停样式(为悬停设置的值)、活动内容(内容选项卡下的活动内容和/或设置)。

#8 快速访问

快速访问是一个容易被忽视的功能,但它可以显着节省开发时间。 此功能仅适用于其中一种可视化构建器视图模式。 当您打开模块的设置时,您可以将鼠标悬停在可视化构建器中的模块元素上,以显示蓝色边框突出显示和快速访问按钮。 单击这些新的快速访问按钮后,您将直接进入模块中该特定元素的相关设计设置。

例如,请注意导航到文本模块中标题的样式设置是多么容易。

此功能也以相反的方式起作用。 快速访问还可以轻松识别模块设置中页面上的相关元素。 当您搜索(或悬停)选项时,Divi 将指示每个选项组属于哪个模块元素,并带有蓝色突出显示边框。

请注意,将鼠标悬停在模块设置中的“标题文本”选项组上时,标题文本元素是如何突出显示的。

#9 色彩管理器和神奇色彩建议

在设置模式中更改元素的颜色时,颜色管理器和魔术颜色建议功能非常方便。 例如,您可以快速切换最近使用的颜色以及保存的调色板。 而且,您可以打开神奇的颜色建议网格,为您保存的或最近的调色板中的每种颜色显示一行建议颜色。

#10 查找和替换

查找和替换允许您在几秒钟内用全新的值替换整个页面的任何值。 只需右键单击设置并选择查找和替换选项。 这将允许您在整个页面或页面的特定部分搜索特定值并用新值替换这些值。 这意味着您可以在几秒钟内更改整个页面的配色方案、字体等。

例如,如果您的页面始终使用相同的绿色样式,您可以右键单击使用该颜色的任何颜色选项(如标题文本颜色)以找到用不同的颜色值替换该颜色值。

在“查找和替换”弹出窗口中,您可以选择将整个页面中的颜色替换为蓝色。 然后,如果您选择“全部替换”,则无论哪个元素正在使用该颜色的所有实例,颜色值都将被替换。

这会在几秒钟内改变整个页面的配色方案。

#11 扩展样式

扩展样式允许您将特定样式选项或整个元素的样式扩展到整个页面的其他元素。

要在 Divi 中扩展样式,只需右键单击任何元素、选项或选项组,然后选择扩展样式选项。 然后,您可以选择要将样式扩展到的位置和元素。 您可以将样式扩展到特定位置的特定模块,也可以使用位置和元素定位将样式扩展到整个页面的所有模块。

例如,假设您设计了一个数字计数器模块,并希望将该模块的所有样式扩展到该行中的其他数字计数器模块。 只需右键单击数字计数器模块并选择“扩展数字计数器样式”。 然后,在扩展样式模式中,选择在整个行中扩展样式。

所有数字计数器模块都将继承该模块的样式。

您还可以扩展特定设计选项(或选项组)的样式。 例如,假设您已经为您的一个数字计数器模块添加了一个边框,以及将这些边框样式扩展到您行中的其他模块的内容。 只需右键单击边框样式选项组,然后选择“扩展边框样式”。

在“扩展样式”模式中,选择将边框样式扩展到整行的所有数字计数器。

这会将行样式扩展到该行中的所有数字计数器模块。

#12 拖放文件上传

使用拖放文件上传功能,您现在可以将文件从计算机直接拖放到后端构建器中。 Divi 检测您上传的文件类型,并自动将它们转换为许多不同的模块,或以创造性的方式将它们应用到页面。

例如,您可以将多个图像拖入 Divi Builder 以在页面底部自动创建一个图像库。 只需突出…

5分钟生成10篇英文软文article forge软件试用
tiktok
WordPress divi主题