如何在 WordPress 中创建锚链接

已发表: 2020-08-17

当你写一篇长文时,如果你能把它们分成不同的部分,那将是用户友好的。 它可以帮助用户跳过内容的某些部分并在文章中上下移动以阅读他们需要的信息。

在这篇文章中,我们将讨论如何在 WordPress 中创建锚链接。 如果你想创建锚链接,那么你应该仔细阅读这篇文章。

内容
1什么是锚链接?
2如何在WordPress中手动创建锚链接?
3如何在 HTML 中创建锚链接
4如何自动添加标题作为锚链接

什么是锚链接?

锚链接可帮助您跳转到帖子的特定部分。 借助这些链接,您可以从特定位置跳转到帖子中的所需部分。

您可能已经注意到锚链接负责在文章中创建目录。 将长片段分成不同的部分很有帮助。 可以使用名称属性或ID属性创建锚链接。

默认情况下,锚链接直接跳转到特定标题。 但是,您可以更改它以获得流畅的滚动体验。

在学习如何在 WordPress 中创建锚链接之前,先看看锚链接的这些积极和消极方面。

优点

它创造了更好的用户体验。 如果帖子很长,那么阅读和滚动整个内容将花费很长时间。 但是,如果有锚链接,读者可以跳转到特定部分阅读内容。

如果您在帖子中创建了锚链接,则锚链接会多次出现在SERP 列表中。 因此,网站的点击率会随着用户在搜索结果中看到有趣的内容而增加。

缺点

它减少了用户停留在您网站上的平均时间。 如果内容在不同部分的帮助下分开,用户更愿意去他们想要的部分而不浪费他们的时间。

如果您的网站靠广告收入运行,您的展示次数和点击次数可能会减少。 作为回报,这将影响您的网站收入。

如何在 WordPress 中手动创建锚链接?

在创建锚链接之前,您需要记住两件事:

  1. 在锚文本之前添加# 符号
  2. id 属性添加到目标文本。

让我们详细讨论一下。

第 1 步:创建锚链接

首先,您需要选择要在其中创建锚链接的文本、图像或按钮。

选择后单击插入链接选项。

创建锚链接
创建锚链接

通常,您保留要链接的帖子或页面的 URL。 但是,要创建锚链接,请使用# 作为前缀,后跟您希望用户去的部分的关键字。

单击输入按钮以创建链接。

您应该在锚链接中包含关键字并使用连字符分隔单词。 此外,最好避免制作长锚链接。

创建链接后,您将看到单击链接在编辑器上不起作用。 这是因为您需要添加一个锚链接作为 ID。

第 2 步:将 ID 属性添加到目标部分

当用户单击锚链接时,转到您想要移动用户的部分。 目标部分可以是标题块、段落块或任何其他块。

如果目标部分是标题,请选择标题块并打开右侧的块设置。 您将在Advanced选项卡下看到HTML Anchor 字段

添加标识属性
添加标识属性

在 HTML Anchor 字段中,您需要添加用于创建锚链接的文本。 在这种情况下不要添加前缀#

保存帖子,然后单击锚链接将您移至所需部分。

现在您知道如何在标题块中添加锚点 ID。 正如我们之前讨论的,块也可以是任何其他类似块的段落。 对于任何其他块,首先,您需要打开块设置。 当您单击编辑为 HTML 时,您可以编辑该块的 HTML 代码。 您将看到 HTML 属性,如 <p>、<table> 分别用于段落、表格块等。

 <p></p>

您应该将锚点添加到 ID 属性。 但注意不要添加前缀#。 这个媒介应该类似于我们在标题块中所做的。

如果屏幕显示意外或无效内容,请单击转换为 HTML 。 保存更改,然后您就可以开始了。

此外,您可以将用户发送到另一个页面上的锚链接。 为此,您需要添加带有 HTML 锚的 URL,如下例所示:

 example.com/desiredpage#desired-anchor

如何在 HTML 中创建锚链接

它类似于上面完成的步骤。 首先,您需要创建一个带有# 前缀<a href=””>标记的锚链接。

 <a href="#anchor-link-example">Example of Anchor Link</a>

创建链接后,向下滚动到要将用户发送到的目标部分。 此部分可以是任何 HTML 元素,例如标题、段落。

在 HTML 标记中,id 属性应包含不带 # 前缀的锚链接。

 < p >Destination of Anchor Link</p>

这是一个段落标签的例子。 您可以以类似的方式将 id 属性添加到其他 HTML 元素。

如何自动添加标题作为锚链接

博主更喜欢它,因为它节省了为每个帖子一次又一次地创建锚链接的时间和精力。 不同的插件对于在 WordPress 中创建表格很有用。

以下是我们为您的网站推荐的表格插件列表:

WordPress 的最佳免费表格插件

请安装其中一个插件并激活它们。 然后测试插件的设置以在目录中自动将帖子的标题添加为锚链接。

结论

我希望这篇文章对您了解如何在 WordPress 中创建锚链接有用。

附加阅读

  1. 如何重新安装 WordPress
  2. 如何在 WordPress 中编辑 HTML
  3. 如何在 WordPress 中添加元描述