朝阳网站开发：divi模块生成器怎么安装

DiviBuilder包含了许多模块来帮助您在布局中添加几乎所有的设计元素，但是如果您想创建自己的模块呢？一个名为DiviModuleBuilder的第三方插件给了你这个能力。

在朝阳网站开发这篇文章中，我将看一下这个插件，看看它能做什么，使用起来有多容易。它要求Divi3.0.50或更高，并与Divi和EXTER一起工作。它可以在开发者的网站上找到：DiviPlugins.com.

安装Divi模块生成器

激活插件后，单击DMB激活页。或者，您可以通过以下方式看到这个屏幕：自定义模块在仪表板中单击许可证.

输入您的许可证密钥并单击激活许可证。将一个新菜单添加到仪表板上，名为自定义模块。在此菜单中，您将找到构建模块所需的一切。

添加模块

模块在仪表板菜单中创建自定义模块, 添加模块。您将使用两个区域来创建模块。左边的区域是您创建字段的地方。右边的区域是您将添加字段将使用的代码的地方。您可以使模块成为标准或全宽度。您可以在准备好时保存草稿或发布。一旦模块发布，它将出现在DiviBuilder中。

田

您的模块可以有任意多的字段。每个字段中都有字段属性。下面仔细研究一下该字段的每个属性：

字段标签-将在模块的内容选项卡中显示为字段标题的标签。

字段标识符-一个独特的值，您将使用它来引用HTML中的字段。字段标识符仅使用小写字母、数字和下划线。

字段描述-添加您自己的描述，以解释该领域的用途。这将显示在模块的内容选项卡的输入下面。此字段是可选的，但我建议添加信息或示例以帮助用户。

字段类型-确定用户看到的输入类型。从下拉框中选择几种字段类型，包括文本、文本区域、颜色、图像、“是”/“否”按钮和图标。

设计标签-在模块的设计中添加此字段的字体控件。如果您选择文本或文本区域，您将看到此选项。您必须通过在HTML中添加类来识别应用字体控件的元素。

隐藏场-让用户控制HTML输出中元素的字体，而不让用户控制该元素的内容。只有在选定文本或文本区域字段类型时，此选项才可用。

添加字段标签、标识符、描述、选择字段类型、启用设计选项卡或选择隐藏字段。通过单击每个字段上的上/下箭头重新排列字段。每个部分和字段都提供了描述和示例。

电码

添加自定义HTML、PHP、CSS和JavaScript来控制输出。HTML字段可以接受自定义查询和PHP。在PHP识别代码之前，您需要启用它。否则它将在屏幕上打印代码。HTML和PHP都使用字段标识符来引用字段。

代码快捷方式作为代码字段下的按钮提供。这包括标记和字段标识符。添加您的字段标识符，然后它在代码区域底部可用，您可以单击此处将它们添加到代码中。HTML标识符被视为橙色按钮，PHP被视为绿色。您可以使用比可用的快捷方式更多的东西，但这些都是为了帮助加快开发时间。

创建模块

下面是一个创建模块的快速示例。标题将是显示在DiviBuilder中的模块上的名称。我添加了字段标签、描述、选择了文本作为字段类型，并创建了字段标识符。

我将其保存为草稿，这样标识符就会出现在HTML快捷方式中。接下来，我从快捷键中选择H1标签，将光标放在标签之间，从HTML快捷键中选择标签。一旦我完成，我就点击发布。结果应该是一个带有字段的模块，用户可以在其中输入文本。输出将文本显示为标题1。

模块现在出现在DiviBuilder中。我可以添加到页面中，就像任何Divi模块一样。

Content选项卡包括我在标签中添加的字段。

模块显示我输入到字段中的文本。由于我添加了HTML以显示为H1，文本自动具有H1属性。我可以添加“设计”选项卡，以包含更多的自定义功能。这需要一些代码才能正确地锁定字段。

模块

您可以在仪表板菜单中看到模块列表。去自定义模块, 模块。在这里，您可以编辑或删除模块。它显示每个模块是否打开或关闭PHP。如果你想克隆一个模块，你必须在设置.

自定义模块设置

朝阳网站开发这个设置菜单提供了一个可以管理模块的位置。您可以查看已发布的模块和草稿模块。

您可以克隆它们，这为您提供了一个很好的起点，您可以从一个需要大量代码的模块开始，而您已经在另一个模块中使用了这些代码。您还可以编辑、禁用或启用PHP(如果您因为代码错误而被锁在编辑器之外-我这样做并使用此特性编辑模块)，并导入和导出模块是很有帮助的。

添加依赖项

在这里，您可以添加第三方CSS和Javascript依赖项。将它们添加为外部或内部URL。从下拉框中选择CSS或Javascript，添加名称并添加URL。然后，它们可以在任何页面上使用。给出了一个使用字体的示例。这是一种很好的方法，可以在一个位置创建依赖关系，然后在任何地方使用它。

DVI模块生成器示例-自定义博客网格

我不是以创建一个“OK”模块为例，而是展示了开发人员创建的令人敬畏的示例-自定义博客网格(可用于下载在开发商的网站免费)。它包括3个字段，HTML、PHP和CSS。下面看看每一个。

自定义博客网格模块

字段1被标记为类别，使用类别作为标识符，字段类型被设置为文本。

字段2标记为B&W图像效应。标识符是Filter，字段类型是Yes/No Toggle。过滤器是用CSS创建的。

字段3被标记为POST标题，并使用POST_title作为标识符。字段类型设置为Text，并启用了“设计”选项卡。我们将在模块中看到该字段的自定义。该字段在HTML中被赋予一个H2类。

PHP被选中，因此它可以在HTML输出代码框中使用。

自定义CSS被添加到CSS输出框中。

这是Javascript。您需要对HTML、PHP、CSS和Javascript有一个很好的理解，才能从这个插件中得到最大的好处。换句话说，这是一个为开发人员提供的插件。

Divi Builder中的自定义博客网格模块

一旦模块发布，您将在DiviBuilder中找到它。

在模块中显示的设置及其标签将根据所做的选择而有所不同。此模块允许您添加类别，启用黑白效果，并在“内容”选项卡中添加帖子标题。它还包括后台设置(模块默认设置)。

此模块启用“设计”选项卡。它包括文本设置、标题文本设置、边框设置、间距设置和动画设置。

自定义博客网格结果

结果是一个带有悬停动画的博客网格。我启用了黑白模式，所以图像显示为黑白，除非我悬停在它们上面。我更喜欢这种形式的悬停-显示悬停的图像，而不是模糊它。

在这个版本中，我禁用了黑白模式，更改了标题字体，并添加了背景渐变。可以在代码中添加更多的调整，以更改按钮、添加覆盖等。如果你能对它进行编码，你就可以让它做任何你能想象到的事情。

许可证和文件

有三种许可证可供选择：单一、无限和寿命。无限许可证涵盖无限的网站，包括一年的更新和支持。终身无限站点许可证包括终身更新和支持。

文献资料在开发商的网站上提供。示例代码包括一步的说明.

最后思想

divi模块生成器是一个功能强大的插件，有很多的潜力在右边。因为它确实需要很好的代码知识，所以并不适合每个人。这为开发人员提供了一个创建和共享模块的优秀工具。我喜欢你可以从一个网站进出口到另一个网站。每个使用该模块的站点都需要安装插件。如果您对代码有很好的了解，并且对创建您自己的Divi模块感兴趣，那么DiviModuleBuilder值得一看。

我们想听听你的消息。你试过Divi模块生成器吗？让我们知道你在朝阳网站开发评论中是怎么想的。