如何更改 WordPress 中的链接颜色(初学者指南)

技术教程 2021年11月5日
1188 0

您想在 WordPress 中添加超链接吗?最近，我们的一位用户询问我们如何在 WordPress 中添加链接.

有几种不同的方法可以在 WordPress 中添加链接.您可以在帖子、页面、导航菜单、侧边栏小部件、页脚区域等中添加链接.

在这个全面的初学者指南中，我们将向您展示如何在 WordPress 帖子、页面、小部件、导航菜单等中添加链接.

How to easily add a link in WordPress

由于这是一个详细的教程，请使用下面的导航快速跳转到您需要的部分:

  • 如何在 WordPress 帖子和页面中添加链接
  • 如何在 WordPress 文本小部件中添加链接
  • 如何在 WordPress 导航菜单中添加链接
  • 如何将标题和 NoFollow 添加到链接
  • 如何在 WordPress 中创建按钮链接
  • 如何在 WordPress 中嵌入链接内容
  • 如何在 WordPress 中添加附属链接
  • 如何在 HTML 中手动添加链接
  • 如何在 WordPress 中添加锚链接
  • 如何在 WordPress 中添加社交分享链接
  • 如何更改 WordPress 中的链接颜色

为什么链接很重要?

链接是互联网的血液，这使得它们非常重要.

基本上，互联网上的大多数网站都是通过链接连接的，这就是最初引入"网络"或"万维网"一词的原因.

这些是您单击以从一个页面转到另一个页面或从一个网站转到另一个网站的超链接文本、按钮和其他元素.

想象一下访问一个没有链接供您点击的网页.您别无选择，只能单击浏览器中的后退按钮.

对于单个网站，链接会告诉您的用户点击哪里可以查看更多信息.

在您的网站上正确放置链接可以增加用户在您网站上花费的时间.它还可以帮助用户发现更多内容、在您的在线商店进行购买或订阅您的电子邮件通讯.

话虽如此，让我们来看看如何在 WordPress 网站的不同区域轻松添加链接.

如何在 WordPress 帖子和页面中添加链接

WordPress 使用块编辑器可以非常轻松地在您的博客文章和页面中添加链接.

只需编辑您的帖子或页面，或创建一个新的.

接下来，突出显示要附加链接的文本.此选定文本称为链接的锚文本.现在点击"链接"按钮:

您会看到一个框，您可以在其中输入 URL.URL 是一个网址.例如，WPBeginner 关于如何创建 WordPress 博客的指南的 URL https://www.wpbeginner.com/start-a-wordpress-blog.

您可以简单地复制并粘贴要链接到的帖子或页面的网址，如下所示:

Creating a link by pasting in a URL using the WordPress block editor

点击应用(回车)按钮将链接插入到您的帖子中.

如果您要链接到自己网站上的内容，那么搜索它可能会更快.从您的内容标题中输入一两个词，WordPress 会找到它:

Searching for a page to link to using the WordPress block editor

点击您要链接的页面或帖子的标题，系统会自动为您添加网址.同样，您需要点击应用按钮将链接放入您的帖子中.

如果要将链接设置为在新标签页中打开，请单击右侧的箭头.然后，您可以点击切换按钮并将链接设置为在新标签页中打开.

Setting your link to open in a new tab using the WordPress block editor

注意:我们建议您仅将此选项用于指向第三方网站的链接.这样您的用户在访问您的网站时就不会离开您的网站.

在旧的 WordPress 编辑器中添加链接

如果您使用的是较旧的经典编辑器而不是块编辑器，那么添加链接的过程非常相似.

打开您要编辑的帖子，或创建一个新帖子.找到要用作链接锚点的文本并突出显示它.然后，单击应出现在工具栏按钮第一行中的"链接"按钮.

Creating a link using the WordPress classic editor

然后，您可以复制并粘贴要链接到的 URL，或在块编辑器中搜索它.

将您的网址直接粘贴到锚文本

在块编辑器和经典编辑器中添加链接的另一种更快的方法是简单地将 URL 粘贴到锚文本上.

首先，复制您要链接到的 URL.然后，在帖子中突出显示您选择的锚文本.

接下来，您可以右键单击并选择"粘贴"，或者只需按 Ctrl+V (Windows) 或 Command+V (Mac) 来粘贴 URL.

Paste your link directly into your content

WordPress 会自动检测到您粘贴的是 URL，而不是文本，并将锚文本转换为链接.

查看我们掌握 WordPress 内容编辑器的技巧，以了解有关有效使用块编辑器的更多信息.

如何在 WordPress 文本小部件中添加链接

WordPress 允许您将小部件添加到站点的非内容区域，例如侧边栏、页脚或其他小部件区域.

其中一些小部件是自动化的，没有很多选项.例如，"最近的帖子"小部件将自动显示指向您最近帖子的链接.你不需要做任何额外的事情.

但是，如果您想在侧边栏中添加一些带有链接的自定义文本，则可以使用文本小部件.

转到外观»小部件页面，然后将"文本"小部件拖到侧边栏或其他小部件区域.

然后，您可以输入文本并添加链接，就像向帖子或页面添加链接一样.

Adding a link in a widget

确保在进行更改后点击小部件下方的"保存"按钮.

如何在 WordPress 导航菜单中添加链接

您要添加指向您网站导航菜单的链接吗? WordPress 带有内置的拖放菜单编辑器，允许您在 WordPress 站点上创建和管理导航菜单.

转到外观»菜单页面.如果您还没有设置菜单，则可以通过输入菜单名称来创建菜单.

接下来，在左侧选择要添加到菜单中的页面，然后点击"添加到菜单"按钮.

WordPress 将自动链接到您选择的帖子和页面.您可以上下移动菜单项来重新排列它们.

您还可以在菜单中添加任何您想要的链接.它不必是您网站上的页面或帖子.例如，您可以输入您的 Twitter 个人资料的网址并将其添加到您的导航菜单中.

要输入链接，只需点击左侧"自定义链接"部分旁边的箭头即可.然后，您可以输入 URL 和要用于链接的文本.

Adding a custom link to your navigation menu

有关创建菜单的更多帮助，请查看我们的初学者指南，了解如何在 WordPress 中添加导航菜单.

如何在 WordPress 链接中添加标题和 Nofollow

给链接起个标题通常很有用.这是当有人将鼠标光标移到链接上时出现的文本，如下所示:

A link with a title

添加标题通常可以明确链接指向的位置.它可能对您的读者有所帮助，甚至令人放心.

但是，WordPress 不允许您使用默认编辑器为链接添加标题.您仍然可以添加它，我们稍后将向您展示如何执行此操作.

您可能还想向外部链接添加 nofollow 标签.这告诉搜索引擎不要将您网站的 SEO 分数传递给该链接，因为您不拥有或控制该网站上的内容.

WordPress 默认也不支持 nofollow.

方法一、在古腾堡使用AIOSEO插件

WordPress 的多合一 SEO 插件 (AIOSEO) 会自动将标题、nofollow、赞助和 UGC 属性添加到您的链接.

All in One SEO Title and Nofollow

方法 2.在古腾堡中使用 HTML 代码

如果您使用的是 Gutenberg 编辑器，并且不想使用 AIOSEO，那么您需要手动编辑 HTML 以将 title 和 nofollow 属性添加到您的链接中.

首先，以通常的方式在段落块中添加链接.接下来，单击三个垂直点并选择"编辑为 HTML"，如下所示:

Switching to the HTML view of a block in the WordPress block editor

您现在将看到您的块的 HTML 代码.

Viewing the HTML code for a block in the WordPress editor

您可以像这样向链接添加标题和/或 nofollow 属性:

<p>You can find out more about our company on our <a href="https://www.examplecompany.com/about-us/" title="About Us" rel="nofollow">About Us</a> page.</p>

对于标题，您可以将"关于我们"更改为您想要的任何内容.使用 nofollow 属性，这应该总是 rel="nofollow".不要忘记标题和"nofollow"周围的双引号，因为没有它们，您的链接将无法正常工作.

方法 3.在经典编辑器中使用插件

如果您使用的是经典编辑器，则可以安装并激活 Title 和 Nofollow for Links 插件.

此插件将向插入链接弹出窗口添加标题、nofollow 和赞助复选框选项.

突出显示您的锚文本并单击"链接"按钮，然后单击齿轮:

Locating the cog icon for a link in the classic editor

然后您会看到其他选项:

Additional options created by the Title and Nofollow for Links WordPress plugin

如需更多帮助，请查看我们的指南，了解如何在 WordPress 的插入链接弹出窗口中添加标题和 nofollow，以获取有关此插件的更多信息.

如何在 WordPress 中添加链接按钮

您想在 WordPress 帖子或页面中添加按钮吗?有很多方法可以做到这一点.最简单的方法是使用 WordPress 的内置按钮块.

创建新帖子或页面，或编辑现有帖子或页面.然后，单击 (+) 图标以创建新块.从"布局元素"选项中选择"按钮"，或者直接搜索按钮块.

Adding a 'Button' block to your post or page in WordPress

您可以通过单击彩色区域来键入按钮的文本.在"链接"框中输入按钮应转到的 URL.

Adding the text and link for your button

要更改按钮的对齐方式，或将文本设为粗体或斜体，只需使用块本身顶部的控件即可.

您可以在屏幕右侧的块选项中对按钮的外观进行更多更改.例如，您可能想要更改颜色或添加更宽的边框.

您也可以在此处更改链接设置.您可以将链接设置为在新标签页中打开，如果需要，您还可以通过在"链接相关性"框中键入来将"nofollow"属性添加到链接中.

The right hand panel where you can edit your button's design and how the link works

如果您仍在使用旧的 WordPress 经典编辑器怎么办?您可以安装"忘记短代码按钮"插件，以便在编辑帖子或页面时轻松创建按钮.

只需安装并激活 Forget About Shortcode Buttons 插件即可.然后，创建一个新帖子或编辑现有帖子.

您会在右侧的工具栏中看到"插入按钮"图标:

The Insert Button icon on the right hand side of the classic editor's toolbar

点击按钮，您会看到一个弹出窗口.在这里，您可以自定义按钮、选择颜色、边框、添加文本、添加图标以及在查看实时预览时包含链接本身.

Creating a button for your link and customizing the design

有关更多信息和详细信息，请查看我们的指南，了解如何在不使用短代码的情况下在 WordPress 中添加按钮.

如何在 WordPress 中嵌入链接内容

只需在帖子中插入其 URL，您就可以轻松地在 WordPress 中嵌入某些类型的内容.这有时称为在您的帖子中创建"内容卡片".

只需将整个 URL 粘贴到其自己的段落块中即可.整个推文，包括图像、喜欢、时间戳等，将像这样嵌入:

Embedding a tweet by pasting in the link to it in WordPress

YouTube 视频的流程相同.只需在 YouTube 上找到您要使用的视频，然后从浏览器窗口顶部复制 URL:

Get the link to your chosen YouTube video from your browser's address bar

接下来，将链接粘贴到您的帖子或页面中.它会自动嵌入视频:

Embedding a YouTube video into your post

这种方法不仅适用于 Twitter 帖子和 YouTube 视频，还适用于许多其他类型的内容.您可以从 WordPress 关于"嵌入"的支持文章中找到更多信息.

如何在 WordPress 中添加附属链接

您想通过使用附属链接来增加您网站的收入吗?联属网络营销为许多博客和网站提供了稳定的收入.

您需要做的就是添加指向您推荐的产品和服务的特殊推荐链接.当您的访问者在点击您的链接后购买这些产品时，您将获得佣金.

大多数初学者面临的问题是他们想要推荐的每个产品或网站都有不同的 URL.跟踪这些很棘手，尤其是当您推荐大量产品时.

添加和管理会员链接的最佳方式是使用会员管理插件.我们建议使用 Pretty Links 或 Thirsty Affiliates.

这两个插件都通过创建重定向链接来工作，例如 www.yoursite.com/refer/partnersitename，将人们发送到您的特殊会员链接.

插件将向您的 WordPress 菜单添加一个新选项，您可以在其中添加您的会员链接.这是 ThirstyAffiliates 的样子.您只需将您的特殊会员链接复制并粘贴到"目标网址"框中即可.

Adding a link in ThirstyAffiliates

您可以在右侧为您的链接设置特定选项，决定是否不关注它、在新窗口/标签中打开它等等.

Setting the options for your affiliate link with ThirstyAffiliates

完成后，点击"保存链接".

设置附属链接后，您可以轻松地将它们添加到您的帖子和页面中.在段落块中，单击向下箭头，然后选择"附属链接"选项:

Adding an affiliate link to your post

接下来，输入您为该附属链接命名的任何内容的开头.在我们的示例中，它是"我们的附属合作伙伴".

Finding your affiliate link by searching for it

然后您可以单击名称并单击"应用"以将附属链接添加到您的帖子.

如果您需要更改附属链接(例如，如果您要链接的公司转移到不同的附属计划)，那么这真的很容易做到.

您只需在仪表板中的"ThirstyAffiliates"或"Pretty Links"下更改一次即可.重定向链接和以前一样，但现在它会在任何使用它的地方重定向到新的附属链接.

有关更方便的联盟插件，请查看我们关于 WordPress 最佳联盟营销工具和插件的帖子.

如何在 HTML 中手动添加链接

有时，您可能希望使用 HTML 代码添加指向您网站的链接.如果您需要使用自定义 HTML 块或小部件，则可能会发生这种情况.

您可能还需要直接编辑主题文件中的链接.只需确保始终使用子主题，这样在更新父主题时就不会丢失更改.

在 HTML 中创建链接很容易.要尝试它，请将自定义 HTML 块添加到帖子或页面.您可以在"格式"下找到此块，也可以使用搜索栏进行搜索.

Adding a custom HTML block to your post or page

接下来，您会看到一个框，您可以在其中编写 HTML.将此代码复制到框中:

<a href="https://www.yourlinkhere.com">Text</a>

它应该是这样的:

The HTML code to create a link

您可以点击"预览"标签来查看您的代码在您的帖子或页面中的外观:

Previewing how the HTML will display in the post or page

现在点击返回"HTML"标签.将 URL 更改为要链接到的 URL.将"文本"一词更改为您要用于链接的任何一个或多个词.

要为链接添加标题，您需要像这样将其包含在代码中.您可以将"This is the title"更改为您想要的任何内容.

<a href="https://www.yourlinkhere.com" title="This is the title">Text</a>

如果您希望您的链接在新标签页中打开，只需将 target="_blank" 添加到 HTML 代码中，如下所示:

<a href="https://www.yourlinkhere.com" target="_blank">Text</a>

如果您希望您的链接不被关注，请添加 rel="nofollow"，如下所示:

<a href="https://www.yourlinkhere.com" rel="nofollow">Text</a>

您可以一次性包含所有这些内容.这是一个带有标题的链接，在新标签页中打开并没有被关注，看起来是这样的:

<a href="https://www.yourlinkhere.com" title="This is the title" target="_blank" rel="nofollow">Text</a>

如果需要，这就是您在 HTML 中创建链接的方式.

锚链接是页面上的一种链接，可将您带到同一页面上的特定位置.它允许用户跳转到他们最感兴趣的部分.

看看下面的动画截图:

Anchor link preview

这些类型的链接在编写较长的教程或内容时非常有用，因此您的用户可以轻松跳转到他们最感兴趣的部分.

我们创建了详细的分步指南，介绍如何在 WordPress 中轻松添加锚链接.

想要在您的网站上添加社交分享链接或按钮?

这些链接使您的用户可以轻松地在他们喜爱的社交网络上分享您的内容.有时，社交分享链接或按钮也会附有总分享次数.

Facebook social share button

我们不建议用户手动添加这些链接.相反，您应该始终使用社交分享插件.

我们有关于如何在 WordPress 中添加社交分享按钮的分步指南.

您要更改网站上链接的颜色吗?

根据您使用的主题，WordPress 将对所有链接使用您主题的默认颜色.但是，有时您可能希望更改链接颜色以提高知名度或与您的品牌相匹配.

您可以通过添加自定义 CSS 代码来更改链接颜色.首先，您需要转到 WordPress 管理面板并导航到 外观 »自定义.

进入 WordPress 主题定制器后，继续并单击"附加 CSS"选项.

WordPress customizer to additional CSS

接下来，您可以添加以下 CSS 代码来更改链接的颜色:

a {
     color: #FFA500;
}

当您添加代码时，您的链接将变为橙色.您可以将 #FFA500 颜色代码更改为您想要使用的任何其他颜色.

完成后，点击"发布"按钮查看您的新链接颜色.

Change link color using custom CSS

如果您不习惯添加自定义 CSS 代码，那么您也可以使用 CSS Hero 之类的 WordPress 插件.它将帮助您在不编辑代码的情况下自定义您的网站.

有关更多详细信息，请参阅有关如何在 WordPress 中更改链接颜色的指南.

我们希望本文能帮助您了解如何在 WordPress 中添加链接.您可能还想查看我们的初学者指南，了解如何创建专业的企业电子邮件地址，以及如何创建电子邮件简报以扩大受众群体.

WordPress(893)添加(37)链接(27)
♥赞11

相关文章

发表回复