首页>文档>Astra教程>使用 Astra 或 Elementor 创建页眉和页脚?

此组别内的文章

需要支持?

如果通过文档没办法解决您的问题,请提交工单获取我们的支持!

使用 Astra 或 Elementor 创建页眉和页脚?

使用 Astra 主题,您始终可以依赖灵活性。自 3.0.0 版起,Astra 主题就附带了拖放式页眉页脚生成器。它提供了一系列功能,因此您可以比以往更轻松地构建页眉和页脚。 

由于页眉和页脚是与内容分开的网站区域,因此可以单独编辑它们。因此,您可以使用 Astra 创建页眉和页脚,同时仍使用 Elementor 处理内容。另一方面,您可以仅使用 Elementor 设计整个网站,包括页眉和页脚。

无论您选择哪种方式,本文档都将向您展示如何充分利用 Astra 和 Elementor 组合。

为什么页眉和页脚很重要?

页眉和页脚是网站的第一部分和最后一部分,因此非常重要。页眉是访客在网站上看到的第一部分,而页脚通常是最后一部分。

使用 Astra 或 Elementor 创建页眉和页脚?-HEIWP-外贸建站

它们位于所有(或大多数)网站页面和包含品牌、导航和其他重要信息的帖子上。

因此,精心设计的页眉和页脚对于出色的用户体验、品牌知名度和转化率至关重要。 

Astra 主题如何与 Elementor 配合使用?

Astra 主题不仅与免费的 Elementor 完全兼容,还与 Elementor Pro 及其主题构建器完全兼容。此外,当您开始使用 Elementor 构建页面时,Astra 将自动为 Elementor 完美设置所有选项。

首先,重要的是要了解您使用 Elementor 来添加和设计页面或帖子内容。其次,主题是将您的网站连接在一起的“粘合剂”。WordPress 主题是您网站的画布 – 一个为其提供结构并设置基础的框架。

因此,Astra 主题将帮助您快速设置网站布局、字体、颜色、侧边栏、面包屑导航、特色图片等。此外,Astra 还将为您提供与您可能需要的一些第三方插件集成的选项,例如 WooCommerce。此外,它还将为您提供自定义 WordPress(例如,博客存档)或第三方插件页面(例如,商店)的选项。

此外,由于 Elementor 的免费版本不附带主题构建器,因此您只能编辑内容。同时,您可以免费使用 Astra 主题构建页眉和页脚,而无需额外的插件。

页眉页脚生成器和 Elementor

事实上,设计出色的页眉和页脚可以为您的网站带来真正的改变。因此,Astra Theme 附带了页眉页脚生成器,可供使用。

使用 Astra 创建的页眉和页脚将与您使用 Elementor 添加的内容完美集成。由于 Elementor 的免费版本没有页眉和页脚构建选项,因此这将是您的默认选项。

此外,我们所有的Elementor 入门模板都是这样创建的。导入任何 Elementor 入门模板时,您将获得一个仅使用 Elementor 创建内容的网站。页眉和页脚将使用 Astra 的页眉页脚构建器构建。  

使用 Astra 或 Elementor 创建页眉和页脚?-HEIWP-外贸建站

Astra 页眉和页脚生成器

步骤 1 – 要构建页眉,请导航至仪表板 > 外观 > 自定义 > 页眉生成器。同样,要开始构建页脚,请导航至页脚生成器选项;

使用 Astra 或 Elementor 创建页眉和页脚?-HEIWP-外贸建站

第 2 步– 要构建页眉或页脚,只需添加、设置样式并将不同元素拖动到所需位置即可。此外,您可以单独设置添加的每个元素。所有其他定制器设置将自动应用;

步骤 3 – 接下来,通过切换视口(桌面、平板电脑和移动设备)并进行调整,以响应方式设计页眉和页脚。您可以使用不同的元素、以不同的方式定位它们,并修改每个视口的设置;

使用 Astra 或 Elementor 创建页眉和页脚?-HEIWP-外贸建站

步骤 4 – 单击“发布”按钮保存更改。

创建页眉和页脚后,您可以使用 Elementor 向页面和帖子添加内容。 

如何使用 Elementor 创建页眉和页脚(免费)?

或者,您可以选择使用 Elementor 构建页眉和页脚。 

为此,您还需要安装“Elementor 页眉和页脚构建器”插件。然后,您可以将默认的 Astra 页眉和页脚替换为使用 Elementor 创建的页眉和页脚。为了说明这一点,我们将向您展示如何为整个网站添加 Elementor 页眉。

您可以通过导航到仪表板 > 插件 > 添加新插件来安装插件。在右上角的搜索栏中,输入“ Elementor Header & Footer Builder ”。单击“安装”按钮。

创建模板(页眉或页脚)

首先,您需要创建一个新模板(页眉或页脚)并使用 Elementor 进行设计。为此,您需要同时激活 Elementor 和 Elementor Header & Footer Builder 插件。

步骤 1 – 导航到仪表板 > 外观 > Elementor 页眉和页脚构建器,然后单击“添加新”按钮;

使用 Astra 或 Elementor 创建页眉和页脚?-HEIWP-外贸建站

第 2 步– 为模板命名,然后单击“使用 Elementor 编辑”按钮开始设计模板。 

第 3 步– 添加您的设计并单击“发布”按钮保存。单击 Elementor 菜单和“退出到仪表板”返回到您的模板设置。

使用 Astra 或 Elementor 创建页眉和页脚?-HEIWP-外贸建站

将模板添加到您的网站

现在您的设计已经准备就绪,您需要设置模板以在前端显示它:

步骤 1 – 选择要创建的元素类型:页眉或页脚。在我们的示例中,我们选择创建页眉;

步骤 2 – 添加显示规则。对于“显示于”选择“整个网站”,对于“用户角色”选择“全部”。选择这些选项会将此页眉或页脚添加到您网站的所有页面和帖子;

使用 Astra 或 Elementor 创建页眉和页脚?-HEIWP-外贸建站

步骤 3 – 单击“发布”/“更新”按钮保存更改。

现在您已设置 Elementor 页眉和页脚。请记住,在 Elementor 编辑器中添加单独的小部件设置将覆盖任何定制器设置。要更改此设置,您需要编辑元素。 

常见问题解答

没有实际的选项来切换页眉。Astra 主题会自动执行此操作。当您在 Elementor 中添加页眉或页脚时,您将使用 Elementor 设置来管理和设计它们。Astra 页眉页脚生成器设置不会反映在这些页眉和页脚上。

相反,如果 Elementor 页眉或页脚不存在,主题将切换到 Astra 的页眉页脚生成器。然后,默认页眉和页脚将反映所有页眉页脚生成器设置。 

如果您使用“Elementor Header & Footer Builder”插件添加了页眉或页脚以将其停用,请按照以下步骤操作:

步骤 1 – 导航至仪表板 > 外观 > Elementor Header & Footer Builder,单击元素名称下的“编辑”;

步骤 2 – 删除显示条件:单击“显示于”下拉菜单并选择“选择”选项。对用户角色执行相同操作;

步骤 3 – 单击“更新”进行保存。

或者,您可以删除元素或停用整个插件以实现相同的结果。

如果您使用 Elementor Pro 和主题构建器添加了页眉或页脚,则可以通过删除显示条件以类似方式停用它们。为此,请按照以下步骤操作:

步骤 1 – 导航到仪表板 > 模板 > 主题构建器,然后根据要编辑的元素选择页眉或页脚类型。单击元素名称下的“编辑”;

步骤 2 – 删除显示条件:单击更新按钮旁边的小箭头图标以打开菜单。单击“显示条件”并删除您找到的任何条件。

步骤 3 – 单击“更新”进行保存。

或者,您可以删除元素或停用整个插件以实现相同的结果。

Astra Customizer 设置将应用于主题默认页眉和页脚以及 Elementor 中设置为遵循默认设置(字体、颜色等)的元素。

您在 Elementor 编辑器中添加的任何设置都将覆盖 Astra Customizer 设置。

例如,假设您在 Customizer 全局设置(自定义 > 全局 > 排版 > 基本排版)中设置了“Helvetica”字体。接下来,导航到 Elementor 设置并将“Arial”设置为 Elementor 页眉的主菜单字体。在这种情况下,字体将以以下方式应用:

– Helvetica 将应用于您网站上未使用 Elementor 添加的所有文本;
– Helvetica 将应用于使用 Elementor 添加并设置为“默认”字体的所有文本;
– Arial 字体将应用于主菜单

0 条回复 A文章作者 M管理员
    暂无讨论,说说你的看法吧
个人中心
购物车
优惠劵
搜索