Elementor Pro制作博客网站 [05] 使用 Theme Builder 管理站点部分

时间：2023-05-05 04:51:02 | 来源：网站运营

时间：2023-05-05 04:51:02 来源：网站运营

Elementor Pro制作博客网站 [05] 使用 Theme Builder 管理站点部分：

https://www.zhihu.com/video/1596888452875878400在上一课中，我们熟悉了 Elementor Editor 并学习了如何使用全局样式自定义我们的网站。

在本课中，我们将熟悉 Elementor Theme Builder，这是一个以直观直观的方式管理所有站点部分的单一位置。

通过单击菜单图标并选择主题生成器，从使用 Elementor 编辑的任何页面访问主题生成器。

主题构建器显示我们网站的所有部分，并允许我们编辑页眉、页脚、帖子模板、页面模板等。模板名称旁边的绿点表示此模板处于活动状态，可供访问者访问。通过每个网站部分的预览，它让我们可以鸟瞰整个网站。由于我们为我们的网站使用了一个工具包，因此所有这些模板都已与其一起导入。凉爽的！

左侧的面板让我们快速了解各种类型的站点部分。
单击特定模板，将向我们展示包含更多信息的更大预览。

例如，让我们看一下存档模板。
我们可以通过单击此处编辑模板，这将直接带我们进入 Elementor Editor。

一些工具包包括针对相同网站部分的多个选项，让我们可以自由地设计我们认为合适的网站样式。我们的工具包包含多个存档模板，我们可以使用它们来显示不同类型的存档，例如一个存档模板用于类别，另一个用于标签。

由于 Xander 计划在一个类别下发布他的所有文章，我们将继续删除任何不需要的模板。单击此处删除此模板。伟大的！

要为特定站点部分添加新模板，请单击此处的加号图标，这会将我们直接带到编辑器。

或者，我们可以单击右上角的加号图标，这将提示我们选择站点部分模板。
单击“i”图标会显示有关该部分的更多具体信息，包括专门的视频和帮助文章。

使用我们学到的知识，我们将继续对我们网站的不同部分进行一些调整，从标题开始。

让我们看看这里需要更改什么。Xander 的徽标看起来有点小，因此我们需要更改其大小。我们还需要连接菜单弹出窗口。

让我们从徽标开始。单击徽标小部件，对其进行编辑。从这里的图标我们可以看出它是动态的，并显示我们之前设置的图像作为我们的网站标志。

转到样式，我们将在其中更改徽标的宽度。接下来，我们将切换到响应式视图以确保徽标在不同设备上看起来不错。

我们将从平板电脑视图开始。如果我们不为响应式设置输入值，它将获取我们在更大的设备视图中输入的值。
这是因为在大多数情况下， Elementor 中的响应式编辑是从较大的视口或屏幕尺寸继承到较小的视口。

所以，正如我们在这里看到的，Tablet 视图继承了 Desktop 视图的值，显示为灰色。

接下来，我们将切换到移动视图。使用顶部的响应栏在设备之间轻松导航，或使用键盘快捷键 Command 或 Control +Shift+M。

这个值不同于 Desktop 和继承的 Tablet 宽度，因为它已经由 Kit 的创建者手动预设。我们将更改宽度值，但正如我们所见，这里没有太大差异。这是因为 logo 大小受列宽的限制，这在 Kit 中也已预先设置。所以让我们调整列，通过单击它，并增加列宽值。

现在我们改变了这一列的大小，标志有空间扩展到它的全宽，但是为了显示给定的宽度，剩下的列被压低了。通过单击剩余的列并更新其宽度来解决此问题。

接下来我们将编辑菜单。单击菜单图标。您会注意到此图标还使用动态链接，这次链接到现有的弹出窗口。让我们通过单击扳手图标确保它连接到正确的弹出窗口，然后在弹出窗口下键入“菜单”并选择正确的弹出窗口。再次单击扳手图标将其关闭。

单击更新以保存我们的更改。现在标题已经完成，让我们看一下菜单弹出模板，看看它是否需要任何更改。

使用 Finder 可以轻松访问它，而无需退出 Elementor Editor。正如我们所见，该模板还使用了徽标小部件。在右侧，我们会找到导航菜单小部件，它从我们在课程前面创建的菜单中提取链接。

这个菜单看起来很棒，让我们继续浏览网站的页脚。我们将再次使用 Finder，这次是导航到“页脚”。向下滚动一点，让我们看看我们需要在此处更改的内容。

我们需要用 Xander 的副本更新标题……和文本编辑器小部件，并更改此图像。我们还将了解如何将表单小部件连接到电子邮件营销服务。然后在底部，我们将更新标题小部件中的信用额度，并添加我们的社交媒体链接。

因此，我们将从选择标题开始，然后更改标题……和文本编辑器小部件内容。接下来我们将选择另一张照片。如您所见，我们这里没有图像小部件，所以让我们看看这个图像是如何显示的。选择它，我们可以看到它在一个列中。我们将单击“样式”选项，从这里我们可以看到该列使用图像作为背景，因此我们需要做的就是单击图像并选择不同的照片。伟大的！

接下来，我们将选择表单小部件。在提交后的操作下，我们可以选择将此表单链接到不同的时事通讯服务，例如 Mailchimp 或 MailerLite。要了解有关将您的电子邮件营销服务集成到 Elementor 表单中的更多信息，请查看说明中的链接。

选择标题小部件以更新信用额度。与链接一样，标题字段也可以使用动态标签。它设置为显示当前日期，通过单击扳手图标，我们可以看到它显示当前年份，由字母 Y 表示。酷。

我们将展开“高级”部分，并更改出现在版权符号之后的文本。最后但同样重要的是，我们不要忘记在更新之前添加我们的社交媒体链接！

就是这样！现在您知道如何使用 Elementor 的一种主题生成器，在一个地方设计和管理您的所有站点部分。在我们继续之前，请花一些时间探索工具包中包含的 Theme Builder 和模板。然后继续并删除任何非活动模板，由灰色状态点指示。
在下一课中，我们将介绍博客的本质：创建和管理新帖子！所以点击继续观看。到时候那里见！

请访问我的主页https://wpeyes.com，找到更多文章与教程。