如何创建令人惊叹的 Astra 主题标题?

标题对于网页上的任何内容都至关重要,因为它们不仅为读者服务,还为搜索引擎服务。令人惊叹且写得好的标题有可能吸引读者阅读您的帖子并增加点击量。标题的范围可以从 H1 到 H6,具体取决于内容的层次结构。页面或文章的主标题是 H1,而 H2 是在文档中组成部分的副标题。 H3 到 H6 标题在 H2 下为文档提供了更多副标题。在继续讨论 Astra 主题如何帮助您在内容中创建令人惊叹的标题之前,让我们考虑一下标题的重要性

目录:

为什么标题对您的网页很重要?

这就是为什么您必须确保在文本中包含标题

1.主题识别

标题对于搜索引擎和读者选择他们在文章中寻找的关键字起着至关重要的作用。文本中的主标题有助于识别材料的主题,副标题则将读者引导至他们感兴趣的领域。

2. 辅助功能

如今,人们主要使用屏幕阅读器来浏览任何内容。任何内容中的标题都很容易被屏幕阅读器拾取,并且对于有效使用屏幕阅读器至关重要。它们还允许读者从一个标题跳到另一个标题以到达所需的主题。

3. 搜索引擎优化

当标题使您的主题易于识别时,搜索引擎就会对您的页面进行搜索查询排名。你的标题越精心起草并填充适当的关键词,搜索引擎就越能提高你的排名。

以下是有关使用免费 Astra 主题功能为您的页面创建令人惊叹的标题的指南。按照以下过程制作您选择的标题。

4. 使页面可扫描

通过使用标题,您可以使页面尽可能易于浏览。众所周知,没有人会阅读整篇文章,尤其是逐行阅读。这就是为什么页面有标题很重要。在所有标题中,最重要的标题是第一个标题,因为它为整个帖子或页面定下了基调。

接下来是副标题,它将内容分成更适合消费的块。不仅如此,文章的结构由标题和子标题显示。简而言之,正确的标题集意味着您可以通过引人入胜的内容吸引受众。

5. 移动设备的可用性

随着时间的推移,移动设备正变得比以往任何时候都更加占主导地位。毫无疑问,网站将从移动设备获得的流量将比以往任何时候都多。因此,如果您的内容正确,您一定会吸引来自移动设备和桌面设备的观众。

简而言之,标题不仅可以为读者优化网页,还可以为搜索引擎优化网页。

如何使用 Astra 主题创建令人惊叹的标题?

首先,要访问 Astra 标题生成器,请登录 WordPress 仪表板,然后从左侧边栏转到外观 > Astra 选项 > 标题生成器,如下图所示:

单击它,您将进入 WordPress 定制器中的“标头生成器”部分。该界面应该与我们这里的界面类似:

正如您所看到的,标头构建器分为三个垂直部分,一个堆叠在另一个之上。中间有“主标题”,顶部有“标题上方”,底部有“标题下方”。 

每个标题都有自己的一组“标题设置”,您可以通过单击标题左侧的齿轮图标来访问这些设置。

从这里,您可以自定义标题高度、边框大小、背景、填充和边距。

另外,请注意每个标题如何分为三个部分。您可以在这些部分中添加和删除标题元素,以使它们更具功能。截至撰写本教程时,您可以访问 12 个标头元素:

  • 网站标题和徽标
  • 主菜单
  • 按钮1
  • 按钮 2(专业版)
  • 搜索
  • 帐户
  • HTML 1
  • HTML 2
  • 二级菜单
  • 社会的
  • 小工具1
  • 小工具2
  • 小部件 3(专业版)
  • 小部件 4(专业版)
  • 购物车

现在,要添加新的标题元素,请将鼠标悬停在该部分上,然后单击“+”按钮。这将显示可用元素的列表。选择您要使用的一个,它将添加到标题部分。

同样,只需单击标题元素旁边的“x”按钮即可删除标题元素。

您还可以通过简单的拖放操作在标题部分之间移动标题元素。

您使用过的所有标题元素都将显示在“常规”选项卡正下方的左侧菜单中。在此处,您还可以找到更改标头类型的选项。免费用户只能选择“透明标题”。但是,如果您使用 Astra Pro,则可以启用“粘性标题”。

从这里,您可以访问标题元素的特定设置。

在“常规”选项卡旁边,有“设计”选项卡。从这里,您可以获得一些基本的设计选项来更改标题的宽度和边距。 Astra Pro 用户可以使用更多高级设置。

Astra 标题生成器还允许您微调网站标题在不同屏幕尺寸(例如台式机、移动设备或平板电脑)上的外观。要选择不同的屏幕尺寸并进行自定义,请使用屏幕左下角的设备选择器。

正如您所看到的,在较小的屏幕上,您会获得一个名为“Off Canvas”的附加区域。这使您可以节省标题空间,并将一些内容移出屏幕,以便访问者可以在必要时进行切换。

这就是我们关于如何使用 Astra 主题创建标题的快速指南。添加完所有标题元素并进行必要的设计更改后,单击发布按钮即可。 

您新创建的 Astra 标头现已在您的 WordPress 网站上启动并运行。

Astra Header Builder:可用选项的快速概述

在上面的教程中,我们使用 Astra 标头生成器创建了一个非常基本的标头,让您了解该功能的工作原理。然而,Astra 标题生成器中有大量工具和选项可以帮助您创建更复杂和令人惊叹的标题。

以下是您可以使用的各种选项的快速浏览:

主标题

Astra 中的默认标头是主标头。它将显示一个徽标和一个导航菜单,可通过 Astra 中的各种主要标题设置进行自定义。

只需安装 Astra 并转到标题部分选择主标题选项并进行自定义即可。标题 > 主标题

您可以使用以下自定义设置

布局

布局设置将管理页面徽标的位置。 Astra 中的徽标有三种不同的位置

左标志

此设置中的徽标会移动到导航菜单的左侧。这是一种典型的标志定位风格。

正确的标志

此设置中的徽标会移动到导航菜单的右侧。

中心标志

此设置中的徽标移动到导航菜单上方的中心。如果菜单很长,这是一个不错的选择。

宽度

宽度设置管理文本标题的宽度。您可以将标题宽度自定义为

全宽

在全角设置中,您的标题将从两端拉伸并适合您的浏览器页面大小。

内容宽度

内容宽度设置中,表头根据设置的容器宽度进行调整,可以通过选择以下内容来设置

全局 > 容器 > 宽度

边界

通过选择边框,您可以在标题下添加边框并自定义其颜色和宽度。

移动标头

在响应式设备上,导航菜单会变成汉堡包。因此,这些设备上的主标题将仅显示汉堡菜单和徽标。您可以自定义与响应式小部件中的菜单相关的徽标布局。

在堆栈选项中,徽标将移动到汉堡菜单上方。如果您有一个大徽标,那么选择堆栈可能会很有用。

排队

在内联选项中,徽标和菜单将相互对齐,对于小徽标来说是一个不错的选择。

颜色主题

主标题可以使用 Astra 主题以各种颜色呈现。全局颜色将免费提供,但您需要使用 Astra Pro 的plugin来获得更多高级功能。要在 Astra 中使用全局颜色,您需要进入“外观”选项卡,选择“自定义”,然后选择“全局”,最后选择“颜色”选项。外观 > 自定义 > 全局 > 颜色

版式

页面或网站的版式设置自动应用到 Astra 主题的主标题。您可以通过转到“全局”下的“外观”选项卡来选择和自定义版式设置。 

外观 > 自定义 > 全局 > 版式

透明标头

透明标题是为页面创建美观且有吸引力的标题的简单方法。主标题的背景将设置为透明,并将页面内容拉到顶部。页面内容和主标题将合并,这意味着内容的顶部将成为透明标题的背景。例如,如果图像位于页面的顶部,它将上升成为透明标题的背景。

如何添加透明标题?

透明标题只需两个快速步骤即可使您的页面更具吸引力 

步骤1

您可以在定制器下找到透明标题的选项,然后可以对其进行编辑

外观 > 自定义 > 页眉 > 透明页眉

步骤2

在透明标题选项下,您可以为整个网站启用它,选择底部边框、配色方案和徽标布局

在完整网站上启用

如果您想要整个网站的透明标题设置,您可以通过勾选复选框来启用此选项。如果您勾选该复选框,您仍然可以为特定帖子或页面启用一些排除规则。您可以禁用以下页面的透明标题选项

禁用档案、搜索和 404

通过勾选复选框,可以在这些特殊页面上禁用透明标题设置。

在博客索引页上禁用

如果您从主页更改设置,则博客的首页将成为博客索引页。要制作博客索引页,您可以进入主页设置,然后在“您的主页显示”选项卡下,选择“您的最新帖子”。

您的首页显示 > 您的最新帖子

如果您想禁用此博客索引页上的透明标题设置,您可以勾选此复选框。

在页面上禁用

如果您想在所有页面上禁用透明标题选项,请勾选该复选框。

在帖子上禁用

如果您想禁用所有帖子的透明标题选项,请勾选该复选框。

颜色和背景

您可以使用以下可用选项自定义透明标题的背景和颜色设置

  • 背景
  • 网站标题
  • 菜单
  • 子菜单
  • 内容

使用 Astra 主题作为标题的优点和缺点

优点

  • 透明标头的机会可用
  • 全宽和内容宽度的标题都可用
  • 颜色和排版可定制

缺点

  • 粘性标题选项不可用
  • 高级颜色功能不可用

最后的话

Astra 是最好的主题之一。而且,如果您正在使用它,那么您就走在了维护网站的正确道路上。

Astra的免费主题允许您为您的网页设计漂亮且有吸引力的标题。透明标题的选项和自定义也可用,这可以增强观看者的体验。 Astra 主题中的许多标题自定义选项可让您创建令人惊叹的标题。

艾哈迈德

查看评论

  • 你好,我的评论包括透明的评论,你已经知道了我的计划,只是菜单上的页面...评论已经发生了?

  • 你好,

    谢谢您的所有信息。 Pourriez-vous svp m'aider ?

    我在页面上看到了 Astra 的独特之处。 Mais soit elle s'affiche sur toutes les Pages soit sur aucune... 评论 je peux faire 吗?

    周一现场执行维护模式。

    祝你好运

    • 您好,Astra 标题分配必须在每个页面设置中按页面进行。在阿斯特拉设定中,这只是全局分配。

最近的帖子

如何在 Elementor 中使用页眉和页脚

网站的页眉和页脚是必不可少的元素。在大多数情况下,标题提供导航...

2022 年 1 月 6 日

WordPress 主题比较:Astra 与 OceanWP

市场上最受欢迎的两个 WordPress 主题是 Astra 和 OceanWP。专业的…

2022 年 1 月 2 日

WordPress 新闻主题比较:Newspaper 与 Astra

创建一个优秀的新闻网站并不需要您成为一名网页设计师。我们…

2021 年 10 月 25 日

创建一个以报纸为主题的新闻相关网站

报纸主题是由 tagDiv 设计的最重要的 WordPress 主题之一,...

2021 年 10 月 18 日

如何使用 Avada WooCommerce 构建器构建电子商务

在建立在线商店时,WooCommerce 是首选plugin。它…

2021 年 10 月 4 日

如何通过 Elementor 使用粘性标题和滚动效果

标题通常是人们访问您的网站时首先看到的东西,...

2021 年 9 月 21 日