Divi Layouts AI：完整指南

在人工智能 (AI) 革命开始之前，构建网页需要编码技能或雇用昂贵的开发人员。 对于一些人来说，由于缺乏经验或预算，这通常是遥不可及的。 由于新技术允许您使用文本提示构建整个网页，这一切都发生了变化。

这篇文章将作为 Divi Layouts AI 指南，向您展示这款令人兴奋的新产品的详细信息。 我们将解释它的作用、工作原理以及如何轻松创建华丽的网页。

让我们深入了解一下。

什么是 Divi Layouts AI？

Divi Layouts AI 是我们推出的一款新产品，它与我们的旗舰 WordPress 主题 Divi 配合使用。 Divi 和 Divi AI 的强大力量相结合，使其成为目前市场上最好的人工智能网站建设者之一。 它可以创建整个页面，帮助您优化现有副本，生成图像并添加代码，所有这些都带有文本提示。 Divi Layouts AI 还可以通过允许您提供颜色和字体来创建与您的品牌相符的页面。 这样，您生成的每个页面每次都会具有一致的外观。

获取迪维AI

Divi Layouts AI 是如何工作的？

Divi Layouts AI 直接内置于 Divi 的框架中，并与 Visual Builder 无缝协作。 由于它对 Divi 代码库的深入了解，它可以从您的网站中学习。 它了解每一行代码和设计模块的工作原理，从而轻松创建漂亮的布局。 Divi Layouts AI 就像设计师、开发人员和摄影师合而为一。

您提供一个简单的文本提示来描述您需要的页面类型，Divi Layouts AI 将创建一个完整的网页，包括文本和图像，并配有 Divi 的设计模块。 它跳过了规划和构建网页结构的初始阶段，让您在设计过程中抢占先机。

使用 Divi Layouts AI 创建完整的网页

要开始使用 Divi Layouts AI，您必须购买 Elegant Themes 会员资格和 Divi AI。 如果您已经是会员，则可以跳过订阅注册过程并单独购买 Divi AI。 其价格为每月 17.04 美元（如果按月付费）或每年 153 美元。

在本 Divi Layouts AI 指南中，我们将引导您完成使用 AI 创建网页所需的步骤，从页面的初始创建到优化输出。

第 1 步：购买 Divi Layouts AI

首先前往 Elegant Themes 主网站并导航至 Divi AI 页面。 您可以注册 Divi + Divi AI 或选择 Divi AI 作为独立产品（如果您已经在使用 Divi）。 单击立即注册！ 按钮继续。

对于这篇文章，我们假设您已经是 Elegant Themes 会员。 单击注册按钮后，系统将提示您登录 Elegant Themes 帐户。

登录后，您将被重定向到Divi AI注册页面，您可以在其中添加其他服务，例如 Divi Cloud、Divi VIP 或 Divi Teams。 如果不进行额外购买，请单击“不，谢谢，继续结帐” 。

输入您的信用卡信息即可完成购买，或者如果您有信用卡存档，只需单击“购买 DIVI AI”按钮即可。

购买后，您可以通过单击帐户 > 订阅来查看您的 Divi AI 订阅信息。 您需要一个 API 密钥才能在 WordPress 安装中使用 Divi AI。 为每个 Divi 安装生成一个唯一的密钥是个好主意。 为此，请单击“帐户”选项卡并导航至“用户名和 API 密钥” 。

页面刷新后，向下滚动并单击“生成新 API 密钥”按钮 (1)。 生成密钥后，为其提供标签会很有帮助 (2)。 如果您打算构建多个 Divi 网站，这种做法特别有用。

单击该键进行复制。 您需要在 Divi 主题选项面板中激活 Divi AI。 前往 WordPress 安装，登录并导航至Divi > 主题选项 > 更新。

输入您的用户名和复制的 API 密钥，然后单击“保存更改”按钮进行保存。

第 2 步：创建新页面

现在您已经添加了 API 密钥，您可以使用 Divi AI 构建网页。 首先向您的 WordPress 网站添加一个新页面。 导航到页面 > 添加新页面。

页面刷新后，为页面指定标题 (1)，然后单击“使用 Divi Builder”按钮 (2)。

您将有三个选项可供选择。 您可以从头开始构建页面、选择预制布局或使用 AI 构建。 选择“使用 AI 构建”并单击“生成布局” 。

第 3 步：向 Divi Layouts AI 提供信息以生成网页

我们将在 Divi Layouts AI 指南的这一部分中引导您完成界面。 当页面首次加载时，将出现一个对话框。 您将在此处描述要创建的页面类型 (1)。 尽管是可选的，但为 Divi Layouts AI 提供尽可能多的上下文是一个好主意。 您可以输入您的使命宣言和价值主张，或者简单地写下有关您网站用途的简短描述 (2)。 您还可以指定字体和颜色以匹配您的公司品牌 (3)。

当指示 Divi Layouts AI 生成页面时，首先描述您的产品或服务以及目标受众。 这样做可以让 Divi 更好地了解要生成什么。 您甚至可以让它创建引人注目的、经过 SEO 优化的标题。 其他需要考虑的事情是提及您的理想客户，描述您想要包含的任何关键元素，以及提及您喜欢的任何特定风格。

为了让您的事情变得更容易，这里有一个简短的提示列表，可以用来制作完美的提示：

• 清晰是关键：撰写提示时要清晰简洁。 您越具体，Divi Layouts AI 就越能理解您想要的外观。
• 提供上下文：考虑在可选的告诉 Divi AI 关于您的网站字段中包含信息。 尽可能多地提供有关您的产品或服务以及目标受众的背景信息。
• 使用关键字：包括描述您的业务或服务的相关关键字。 这不仅可以帮助 Divi AI 编写内容，还可以确保您的页面针对 SEO 进行优化。
• 优化和重新生成： Divi AI 最好的事情之一是您可以生成任意数量的布局。 如果您的第一次尝试不是您想要的，请再试一次！ 可能性是无止境。

第 4 步：使用 Divi Layouts AI 构建页面

现在您已经了解了 Divi Layouts AI 是什么以及它可以做什么，下一步就是开始页面生成过程。 在本教程中，我们将要求 Divi 为宠物零食业务生成布局。 在第一个字段中，输入以下文本：为专业宠物零食业务创建登陆页面。 该公司名为 Critter Cravings，专注于纯天然成分。

我们将在“告诉 Divi AI 关于您的网站”字段中添加使命声明，以便为 Divi AI 提供尽可能多的信息。 输入以下文本：

我们的公司 Critter Cravings 是一家纯天然宠物零食企业，以为毛茸茸的朋友制作美味的烘焙食品而闻名。 我们精心手工制作每一种美食，确保只有最优质、有益健康的原料才能进入我们的食谱。 从松脆的饼干到耐嚼的美食，每一口都一定会让你最好的朋友发出吠声或喵喵声。

我们的零食不含人工添加剂、防腐剂和填充剂，使其成为各种体型和大小的宠物的健康选择。 在 Critter Cravings，我们相信每只宠物都应该得到一点宠爱，我们为提供主人可以信任和宠物喜爱的美食而感到自豪。

在“自定义字体和颜色”下，您可以指定要在网页中使用的字体和颜色。 我们将选择Lato作为标题字体 (1)，选择Open Sans作为正文字体 (2)。 对于颜色，从下拉列表 (3) 中选择自定义。 使用#000000作为标题和正文字体，并选择#F3764D和#6baaae作为主要颜色和次要颜色 (4)。 最后，单击“生成布局”以创建网页 (5)。

Divi AI 将在单击“生成”后创建线框，应用字体和颜色，并生成文本和图像。

第 5 步：微调和定制

我们的 Divi Layouts AI 指南的下一步将向您展示如何优化您的布局。 Divi AI 在制作精美页面方面做得非常出色，但有时，您可能想要进行更改。

使用 Divi AI 生成图像

让我们从为我们的英雄部分重新生成图像开始。 将鼠标悬停在主图像上，然后单击灰色设置图标以显示图像模块设置。

当模块的弹出窗口处于活动状态时，将鼠标悬停在图像预览上并单击AI 按钮。

这将显示几个选项：使用 AI 生成、使用 AI 编辑（您可以在其中修改、扩展和填充、放大或增强图像）、生成和替换图像、更改图像样式或放大图像。 让我们选择“生成”和“替换” 。

Divi AI会在原图的基础上自动为英雄生成4张新图像。 但是，您也可以生成新图像，这允许您添加新提示、指定图像大小等。 您可以从 12 种风格中进行选择，包括照片、3D 渲染、绘画等。

对于本 Divi Layouts AI 指南，我们将选择照片作为样式 (1)，添加简短描述 (2)，选择横向纵横比 (3)，然后单击生成(4)。 作为提示，我们使用了一只可爱而忠诚的狗的照片，当他品尝每一口多汁、入口即化的烘焙食品时，他的眼睛闪烁着期待的光芒。 您可以根据需要提供详细信息，最多 200 个字符。 如果您发现自己很难想出提示，请查看我们关于最佳人工智能提示生成器的帖子，以帮助您提出想法。

Divi AI 生成 4 张图像后，我们可以单击其中一张并选择使用此图像(1) 将其插入模块中。 您还可以再生成四个 (2)、通过生成更多类似于所选图像 (3) 的图像来修改图像，或者输入新的描述 (4) 以重新开始。

使用 Divi AI 精炼文本

Divi AI 的另一个强大功能是其精炼文本的能力。 首先单击英雄部分标题正下方文本模块中的灰色设置图标。

单击文本模块中的AI 按钮以显示 AI 选项。

这将弹出一系列用于编辑现有文本的选项。 选项包括使用 AI 编写、使用 AI 改进、编写和替换以及使用 Divi AI 编辑文本的其他选项。

让我们为本 Divi Layouts AI 指南选择“利用 AI 进行改进” 。 将出现一个对话框，允许您选择内容类型 (1)、您所写的内容 (2) 以及是否希望 Divi AI 应用页面内容中添加的上下文 (3)。 您还可以单击AI 按钮(4) 让 Divi AI 为您生成提示。

无论您想要生成什么类型​​的内容，Divi AI 都可以处理。

使用 Divi AI 生成代码

Divi AI 的另一个巨大好处是它生成代码的能力。 它仅在 Divi 的代码库上进行训练，这使其与其他大型语言模型不同。 这使得 Divi 和 Divi AI 成为适合所有类型用户（从初学者到经验丰富的开发人员）的强大工具。 您还可以使用 Divi AI 构建代码片段库，帮助处理现有代码，并添加所有类型的效果，包括文本动画。 例如，如果您想为我们页面的主标题添加打字机效果，Divi AI 可以轻松处理。

要开始使用 Divi AI 进行编码，只需打开模块的设置，导航到高级选项卡(1)，打开自定义 CSS下拉列表 (2)，然后单击AI 按钮(3)。

当对话框出现时，只需输入您想要创建的效果 (1)，然后单击生成代码按钮 (2)。 在我们的示例中，我们将使用提示为标题提供打字机效果。

Divi AI 将使用选择器生成并应用代码，并将其添加到自由格式的 CSS 字段中。 单击“使用此代码”按钮来实现该代码。

第 6 步：保存您的网页

生成布局并进行优化以满足您的需求后，我们的 Divi Layouts AI 指南的最后一步是保存页面。 值得庆幸的是，Divi 让这部分变得简单。 当 Visual Builder 处于活动状态时，将鼠标悬停在屏幕底部中央的紫色省略号菜单上。

您可以将页面保存为草稿或使用屏幕右下角的相应按钮发布。

这是生成布局并进行一些编辑后的布局的最终​​外观：

Divi 布局 AI 示例

在结束之前，我们提供了一些布局和文本提示，以向您展示 Divi AI 的终极力量。

提示：创建一个包含雪地摩托租赁、套餐和体验的登陆页面。 使用色彩鲜艳的雪地摩托、山脉背景和蓬松的白雪

提示：为电力清洗业务创建联系页面。 包括地图、带有背景图像的英雄部分以及三个电话、电子邮件和地址简介。

提示：为植物苗圃创建一个商店页面。 包括服务部分、联系表格、带有价格的特色产品部分，以及带有充满活力的背景图像的视觉吸引力英雄部分。 包括免费送货、即将举行的销售活动以及本月植物的简介。

提示：为 IT 服务公司创建一个关于页面。 包括概述其服务、价值主张、使命宣言和联系表的部分。 另外，在页脚中包含新闻通讯注册。 添加带有背景图像的大型英雄部分和带有关键字“网络安全”的标题

提示：为附近的健身房创建一个登陆页面。 在英雄中加入新会员优惠，以及健身器材的图像。 还包括“关于我们”部分，列出每项服务，并包括时事通讯注册表。

提示：为汉堡店创建一个菜单页面。 包括美味的食物图片、菜单、在线订购部分以及带有时事通讯注册的页脚

提示：创建一个在线学习课程页面。 展示 6 个图形设计、网页设计、网页开发、应用程序开发、原型设计和 UX/UI 课程。 还展示每个类别的定价、带有背景图像的英雄以及注册用户的登录表格。

提示：为汽车维修业务创建一个登陆页面。 使主题变暗，并带有红色。 包括一个带有汽车黑白背景图像的英雄部分、一个带有关键词“汽车修理”的超大标题和一个图片库。 还包括服务部分、我们做什么部分和号召性用语部分。

使用 Divi Layouts AI 有哪些好处？

正如我们在 Divi Layouts AI 指南中所演示的那样，使用人工智能创建网页非常简单、快速且直观。 它可以帮助初学者和经验丰富的设计师比通常从头开始设计布局更快地创建布局。 这也是激发创造力的好方法，因为 Divi AI 可以生成图像、文本和代码，这为您提供了一个很好的起点。 Divi AI 的另一个好处是您可以生成无限的照片、文本、代码和布局，而没有使用限制。 Divi AI 也是任何 Divi 网站的完美伴侣，因为它了解 Divi 的核心。 最终，Divi AI 是一个令人难以置信的创意助手，可以简化布局创建过程，为您节省宝贵的时间和精力。

Divi 布局 AI 将彻底改变您使用 Divi 的方式

Divi 是最受欢迎、功能丰富的 WordPress 主题。 无论您是想从头开始设计网页还是使用预制布局，Divi 都提供了相应的工具。 随着 Divi Layouts AI 的推出，您只需文本提示即可创建完整的网页。 从创建新页面到启动它的整个过程都非常简化，让您可以在几分钟内创建漂亮、有效的登陆页面。 借助 Divi + Divi AI，您可以使用前端、无代码 Visual Builder 在几分钟内生成图像、文本、代码和完整布局，让您可以将时间集中在业务的其他方面。 有了 Divi，你的创造就没有极限。

获取迪维AI

经常问的问题