使用这个免费的 Elementor 插件设计自定义页眉和页脚

您是否注意到，在使用 WordPress 主题或页面构建器时，您对页眉或页脚的控制并不如您所愿？ 当然，您可以从不同的对齐选项中进行选择，也可以嵌入购物车图标或打开搜索功能，但这是否足够？

当您从事为客户建立网站的业务时，您最不想做的就是给他们一个千篇一律的网站。 你应该尽你所能为他们开发完全定制和令人印象深刻的设计。 从上到下。

但这样做意味着要修改 header.php 和 footer.php 文件中的代码……而这是你真正想要搞砸的东西吗？ 如果您可以使用现有的工具为您的 WordPress 网站提供独特的页眉和页脚，那岂不是更容易？

感谢 Elementor 和另一个方便的插件 - Elementor Header & Footer Builder，您可以！

如何使用 Elementor Header & Footer Builder 插件进行更大的自定义

不可否认，拥有 WordPress 主题来加速网站开发和设计过程是多么的棒。 但是，每个 WordPress 主题在页眉和页脚方面都有限制。 这就是 WordPress 的构建方式。

大多数主题为用户提供了选择标题布局的选项：

他们还提供了向页脚添加不同小部件以及其他信息栏的选项：

如果你想在这里创建一些自定义的东西——特别是如果你想让访问者对网站的第一印象不在图表之外，那么你有两个选择：

1. 创建子主题。 然后编辑 header.php 或 footer.php 文件中的代码以构建您的自定义设计和布局。

2. 使用Elementor 页面构建器以及Elementor Header & Footer Builder插件来简化整个事情。

使用所有免费资源实现专业页眉和页脚的分步说明：

1.激活插件

首先，确保插件已激活：

为了澄清，您将需要上面屏幕截图中的两个插件。

Elementor Header & Footer Builder 插件适用于所有主题。 很少有主题内置支持此插件，而对于少数主题，您需要选择一种兼容性方法。

如果激活插件后，您会看到一条通知 –

Elementor Header & Footer Builder 插件不支持您当前的主题，单击此处查看可用的兼容性方法。

导航到外观 > Elementor 页眉和页脚生成器 > 主题支持。 选择添加主题支持的方法。 如果这些方法不起作用，请联系您的主题作者并请求他们添加对插件的支持。

2. 设置页眉或页脚模板。

在 WordPress 的外观菜单下，单击 Elementor Header & Footer Builder。

• 选择添加新的。
• 命名模板。
• 选择是否要创建页眉或页脚模板。
• 使用模板应出现的“显示规则”选择目标位置。
• 设置将为其显示模板的用户角色。

完成后点击发布按钮。

3. 在 Elementor 中创建页眉或页脚模板

接下来，使用 Elementor 进行编辑。 从这里，您可以从头开始构建您的页眉或页脚模板。

首先，将 columns 元素拖放到右侧的界面中。 然后设置要使用的列数。

建立框架后，填写其余元素。 同样，只需在左侧找到它们并将它们拖放到位。

4. 将导航元素添加到您的模板

这里需要注意的是，免费的 Elementor 插件不附带菜单小部件。 但是 Elementor – Header, Footer & Blocks 插件可以

该插件在 Elementor 编辑器中添加了以下小部件。

• 网站标志
• 网站标题
• 网站标语
• 导航菜单
• 页面标题
• 视网膜图像
• 版权

与 Elementor 中的其他元素一样，您只需拖放导航菜单小部件即可。 只要您在 WordPress 的外观 > 菜单选项卡下创建了一个菜单，您的新菜单现在就会填充到模板中。

如果没有，请返回 WordPress 并创建一个新的，以便您在模板中包含一个导航栏：

设置好导航、完成模板并根据自己的喜好自定义所有元素后，单击更新按钮。

5. 注意响应性

在返回 WordPress 仪表板之前，您还需要在这里做的另一件事是检查新标题元素的响应能力。 如您所知，移动菜单无法真正适应我们在桌面上使用的水平、全宽跨度元素。 因此，请务必在继续之前对其进行自定义。

您可以使用小部件菜单底部的响应式开关设计页眉和页脚模板的移动版本：

这将使您了解新的页眉或页脚元素将如何出现在平板电脑和智能手机上。 如果要编辑特定设备屏幕尺寸的任何元素，请查找元素旁边的图标：

切换到您要为其自定义设置的设备，应用更改，然后对所有其他屏幕尺寸重复此操作。 单击更新按钮以保存所有更改。

6. 验证设计

在 Elementor 中，您的模板现在看起来像这样：

（注意：这是一个基本的标题模型。我们只是包含这个示例，因此您可以看到可以删除主题的默认设置并创建自己的。）

返回 WordPress，将更改发布到您的网站，然后点击“预览”按钮以确保网站前端的一切看起来都不错：

要应用您为站点的其余部分创建的新页眉和/或页脚，请完成最后一步。

7. 在站点范围内应用模板（可选）

如果您使用受支持的 WordPress 主题之一，那么您在此处要做的工作就更少了，因为您的新自定义页眉和页脚元素会在发布后自动填充整个网站。 在这种情况下，您实际上没有第四步（这是使用这些主题的更大论据）。

但是，如果您的客户的网站碰巧使用了不同的主题，并且您仍想为其添加自定义页眉或页脚，那么您需要了解以下内容：

在 WordPress 中构建新页面时，如果您使用的是不受支持的主题，请选择 Elementor Canvas 模板。

选中该框后，您可以快速将模板添加到 Elementor Canvas 页面属性。 通过简单地选择该页面属性，您的网页现在将使用您生成的页眉或页脚模板自动填充：

包起来

看，WordPress 是一个很棒的工具。 但有时它也有其局限性。 在设计页眉和页脚元素时，这一点非常清楚。 但是，使用 Elementor 的这个 WordPress 插件，您现在可以展示对网站这些部分的更大控制权，并为您的客户的网站提供完全属于他们自己的外观。