如何创建自定义 Elementor 博客帖子模板（简易指南）

您是否正在寻找有关如何创建自定义 Elementor 博客文章模板的最简单教程？

博客是提高产品知名度的最流行和最有效的方式之一。 但是，如果您想从内容营销中获得最大收益，则需要确保您的博客页面具有迷人的外观以及正确的信息。

为了使您的博客文章吸引人，您需要创建自己的自定义博客模板。 您可以使用 Elementor 实现出色的博客文章模板来吸引您的受众。 您可以从头开始创建 Elementor 自定义博客页面，也可以使用预构建的模板构建一个。

在本文中，您将学习如何以最简单的方式使用两种方法创建 Elementor 博客文章模板。 所以，继续阅读……

创建自定义 Elementor 博客文章模板需要安装的插件

要使用 Elementor 页面构建器轻松地在 WordPress 中创建博客文章，您将需要两者

• 元素（免费）

• 和 Elementor Pro。

如何从头开始创建 Elementor 自定义博客页面模板

Elementor Pro 提供了从零开始创建令人惊叹的自定义博客文章模板所需的所有必要小部件。 只需按照以下步骤创建您的单个 Elementor 帖子模板：

第 1 步：创建新的单一博客模板

首先，您需要创建一个博客模板。 为此转到WordPress仪表板，然后导航到模板⇒添加新

并单击添加新按钮。 新窗口打开后，从下拉列表中选择Single Post作为模板类型，提供您选择的名称，然后单击Create Template 。

现在您应该看到预制的布局（稍后将介绍如何使用它）。 由于我们要从头开始构建博客模板，请单击右上角的十字按钮关闭此窗口。

第 2 步：为博客文章模板选择结构/布局

现在，您需要为您的博客模板选择一个结构，建议不要使用页面的整个宽度，因为用户很难阅读它。 要为您的 Elementor 自定义博客页面模板选择结构，请单击 + 图标并选择您喜欢的结构，然后单击结构将其插入。

注意：要查看使用您正在创建的模板的博客的外观，请从预览动态内容选项中选择现有博客。 要进行设置，请单击左下角的设置选项。

然后，从“预览动态内容”下拉列表中选择“发布” ，在下面的第二个下拉列表中输入您要选择的博客名称。 最后，点击Apply & Preview 。

第 3 步：添加特色图像小部件并自定义图像样式选项

获得布局后，在左侧编辑器栏中，搜索“特色图像”小部件。 找到小部件后，将其拖放到所需位置。

加载小部件后，自定义图像大小、对齐方式、标题、链接和灯箱选项。

要更改样式设置，请导航到样式选项卡。 在这里您可以更改图像的高度、宽度、不透明度、边框、半径等。

第 4 步：添加和自定义 Elementor Post Info 小部件

在特征图像之后，您应该显示可以使用Post Info 小部件执行的帖子相关信息。 就像特色图片一样，首先搜索帖子信息小部件，然后只需将其拖放到特色图片小部件下方。

在 Elementor Editor 内容选项卡上，您可以将布局设置为默认或内联。 您可以编辑/删除作者、日期、时间和评论选项。 您还可以通过单击 + 添加新按钮将自定义字段添加到发布信息小部件。

再次，转到样式选项卡以自定义样式设置，例如列表之间的间距、对齐方式、图标颜色和大小、文本颜色和排版。

第 5 步：拖放帖子标题小部件并自定义

现在，搜索帖子标题小部件并将其拖放到帖子信息小部件下方。

您可以自定义帖子标题标签的大小、HTML 标签和对齐方式。

在样式选项卡上，您将找到自定义文本颜色、版式、文本笔触、文本阴影和混合模式的选项。

第 6 步：添加和自定义发布内容小部件

现在，拖放帖子内容小部件。 ElementsKit 的帖子内容小部件代表博客帖子的主体（主要内容）。

第 7 步：拖放社交图标小部件以添加社交分享选项

在帖子内容之后，通过拖放添加社交图标小部件。 社交图标将提供在不同社交平台上分享您的博客的选项。

您可以根据需要添加/删除任意数量的社交图标。 此外，您可以自定义图标的形状、它们应显示的列数以及对齐方式。 您还可以为每个社交图标自定义社交平台图标、颜色和链接。

导航到样式选项卡以更改图标大小、颜色、填充、间距、边框类型。

第 8 步：添加作者框小部件并自定义小部件的设置

搜索 Author Box ，然后将小部件拖放到社交图标之后。 如果需要，您还可以从源下拉列表中添加自定义作者。 您可以选择如何/隐藏个人资料图片、显示名称和传记。 您还可以自定义其他设置，例如HTML 标签、链接、布局、对齐。

导航到样式选项卡以自定义选项，例如图像大小、边框、颜色和作者姓名、传记等的排版。

第 9 步：为分页选项添加帖子导航小部件

Elementor Post Navigation 小部件将为读者提供导航选项，以便他们可以切换到不同的博客。 添加帖子导航小部件，例如在编辑器上搜索之前，然后在作者框小部件之后拖放。

您可以显示或隐藏分页标签或箭头符号。 您可以获得大约8 个以上的箭头设计选项。 您还可以自定义上一级和下一级文本。

您可以更改普通视图和悬停视图的标签、标题、箭头和边框的颜色和版式。

第 10 步：拖放帖子小部件以显示相关帖子

为了展示相关帖子，我们将使用Elementor Posts 小部件。 因此，在帖子导航小部件之后拖放帖子小部件。 使用此小部件，您可以更改皮肤颜色、设置列数、每页帖子数、图像位置以及更多设置。 您还可以更改布局、框、图像和内容的不同样式。

第 11 步：添加帖子评论小部件

要为您的用户提供对您的帖子发表评论的选项，您需要添加帖子评论小部件。 搜索帖子评论小部件并将其拖放到帖子小部件下方。

第 12 步：更新并查看 Elementor 自定义博客页面模板

现在所有的设计都完成了，点击更新按钮。 如果显示发布设置窗口，请单击保存并关闭。

这是我们刚刚创建的自定义 Elementor 博客文章模板的预览。

如果您发现上述方法太耗时，您可以选择下面提到的方法，您不必从头开始构建和设计每个部分。

如何使用预制的 Elementor 模板创建单个帖子页面

如果您打算为 Elementor 自定义博客页面使用预构建的模板，只需 3 个步骤即可完成。 让我们检查一下：

第 1 步：从仪表板创建新的单个博客文章模板

与第一种方法一样，您需要创建一个新的单个博客模板。 有关如何创建新模板的更多详细信息，请向上滚动一点并查看第一种方法的第一步（如何从头开始构建博客模板）。

第 2 步：选择预制的 Elementor Single Post 模板

单击“创建模板”后，您将看到包含许多自定义单个帖子模板的 Elementor 库窗口。 在这里，您可以选择您喜欢的任何单个帖子块。 将鼠标悬停在您喜欢的模板上，单击插入。

第 3 步：选择预制的 Elementor Single Post 模板

模板加载后，单击发布按钮以保存所有新的博客模板。

这是使用预制的单个帖子模板使用 Elementor 博客帖子的博客帖子的最终外观。

如何使用 ElementsKit 创建 Elementor 最新帖子页面

现在您已经有了一个有吸引力的单篇文章模板，是时候制作一个自定义博客列表页面了，以便您的所有博客都以一种令人愉悦且用户友好的方式显示。 让我们看看如何使用 ElementsKit 创建自定义 Elementor 最新帖子。

第 1 步：安装和激活 ElementsKit

要创建令人惊叹的博客列表页面以及 Elementor 页面构建器，您将需要 ElementsKit。 ElementsKit 是 Elementor 的一体化插件，具有 85 多个小部件和模块，使 Web 开发比以往更容易。

第 2 步：启用帖子列表相关小部件

激活后，您需要打开帖子相关小部件以构建帖子列表页面。 ElementsKit 提供了许多小部件来显示您的博客列表，其中包括博客帖子、帖子网格、帖子列表、帖子选项卡小部件等。您可以启用要使用的小部件。

第 3 步：添加小部件并自定义

现在，转到博客列表页面，搜索小部件并简单地拖放。 加载小部件后，您可以自定义相关设置以个性化您的博客列表页面。 让我们看看带有一些 ElementsKit 小部件及其自定义选项的博客列表页面会是什么样子。

博客文章：

使用博客文章小部件，您可以以块格式、带有拇指的网格和不带拇指设计的网格显示您的博客。 您还可以设置每行显示的帖子数量、启用/禁用分页以及更多选项。 有关更多详细信息，请查看我们的博客，了解如何显示最近的博客文章。

后网格：

使用 post grid 插件，您可以自定义要在博客列表中显示的类别博客。 您还可以选择要显示的帖子数以及每行应具有的列号。 有关更多详细信息，请查看我们的文档。

发布标签小部件

使用Post Tab小部件，您可以获得所有自定义选项，例如 Post Grid 以及额外的类别选项卡。 使用此选项，用户只需将鼠标悬停在任何类别选项卡上，即可仅查看该特定类别的博客。

一旦您选择了您的小部件并根据您的选择进行自定义，请单击更新按钮进行发布。 现在你应该有一个页面，以诱人的方式显示最近的 Elementor 最新帖子。

最后的话

我们已尽力为您提供有关如何以两种方式创建自定义 Elementor 博客文章模板的简单教程。 我们希望您发现该博客有助于构建您的自定义 Elementor 博客模板。 您可以按照这些步骤并根据您的选择更改布局和设计。

并且不要忘记使用 ElementsKit 小部件为您的博客列表页面提供非凡的触感。 ElementsKit 是 Elementor 的完美补充，请抽出时间查看该插件提供的所有令人惊叹的小部件。