首页 » 博文 » wpbeginner » 最佳插件 » 如何在 WordPress 中添加号召性用语按钮(无需代码)

如何在 WordPress 中添加号召性用语按钮(无需代码)

您想在 WordPress 帖子或页面中添加号召性用语按钮吗?

按钮是提高转化率的好方法。它们非常引人注目,这使得它们非常擅长将用户的注意力转移到所需的交互上。

例如,您可以使用号召性用语按钮将用户引导至交易页面,例如定价页面、产品页面、服务页面以及网站上的其他页面。

您还可以使用号召性用语按钮来宣传特别优惠、新产品或指向合作伙伴网站的联属链接。

在本文中,我们将向您展示如何在 WordPress 中轻松添加漂亮的号召性用语按钮,而无需编写任何代码。

一步一步在 WordPress 中添加按钮

注意:本文适用于在 WordPress 中添加自定义号召性用语按钮。如果您想添加社交分享按钮,请参阅我们有关如何在 WordPress 中添加社交分享按钮的指南。

在 WordPress 帖子和页面中添加按钮(分步)

WordPress 通过内置按钮块添加按钮变得非常容易。这是古腾堡 WordPress 块编辑器引入的一项功能。

在本文中,我们将展示在 WordPress 博客文章和页面中添加号召性用语按钮的三种方法。您可以选择最适合您需求的解决方案。

请随意使用下面的目录轻松浏览本文:

目录

视频教程

https://www.youtube.com/embed/ODA-aW4ysms?version=3&rel=0&fs=1&showsearch=0&showinfo=1&iv_load_policy=1&wmode=transparent订阅 WPBeginner

https://www.youtube.com/subscribe_embed?usegapi=1&channel=wpbeginner&layout=default&count=default&origin=https%3A%2F%2Fwpbeginner.com&gsrc=3p&ic=1&jsh=m%3B%2F_%2Fscs%2Fapps-static%2F_%2Fjs%2Fk%3Doz.gapi.en.vQiXRrxCe40.O%2Fam%3DAQ%2Fd%3D1%2Frs%3DAGLTcCMBxIGVyXSdvvcs43a64yHt_P7dfg%2Fm%3D__features__#_methods=onPlusOne%2C_ready%2C_close%2C_open%2C_resizeMe%2C_renderstart%2Concircled%2Cdrefresh%2Cerefresh&id=I0_1448178294715&parent=https%3A%2F%2Fwpbeginner.com

如果您不喜欢该视频或需要更多说明,请继续阅读。

使用默认编辑器在 WordPress 帖子/页面中添加按钮

此方法简单,推荐大多数用户使用。它使用 WordPress 块编辑器中的内置按钮块。如果您仍在使用旧的经典编辑器,那么您可以跳到下一部分。

首先,您需要创建一个新帖子或编辑要添加按钮的现有帖子。

在帖子编辑屏幕上,单击“+”图标,然后从“布局元素”部分选择“按钮”块。

添加按钮块

接下来,您应该能够看到添加到内容编辑器中的按钮块。

只需单击“添加文本…”区域并输入按钮文本。

添加按钮文本

之后,单击工具栏中的链接按钮添加链接。

您可以搜索帖子或页面,或者只需将 URL 复制并粘贴到链接字段中。

添加按钮链接

完成后,按“Enter”或按“应用”图标保存您的链接。

如果您想在中心显示按钮,可以单击“对齐”图标,然后选择“居中对齐”。您还可以从工具栏更改按钮的垂直对齐方式。

更改按钮对齐方式

接下来,您可以从右侧的块设置面板自定义按钮样式并更改文本和背景颜色。

只需切换到块设置下的“样式”选项卡即可调整按钮样式。

更改按钮样式

您可以选择三种按钮样式:默认、轮廓和方形。您可以通过单击每一项并选择看起来最好的一项来尝试它们。

颜色设置部分包括按钮背景和按钮文本的五种颜色变化。不仅如此,您还可以通过单击“自定义颜色”选项来使用您选择的自定义颜色。

按钮样式设置

一旦您对按钮设计感到满意,您可以保存您的帖子或发布它以查看实时预览。

这是它在我们的演示网站上的外观。

号召性用语按钮预览

奖励:如果您想了解按钮的性能,您应该使用MonsterInsights。它具有针对联属链接、出站链接和自定义事件的内置事件跟踪,因此您可以查看按钮的执行情况。有关更多详细信息,请参阅您必须在 WordPress 中跟踪的重要营销指标

在经典编辑器中创建 WordPress 按钮

尽管古腾堡块编辑器更快更简单,但许多用户仍然更喜欢旧的经典 WordPress 编辑器。如果您是其中之一,那么您需要找到一种替代解决方案来在 WordPress 网站上添加按钮。

在 WordPress 经典编辑器中添加按钮可使用三个选项:

  1. 使用 HTML / CSS 代码在 WordPress 中添加按钮。
  2. 使用 WordPress 按钮短代码插件在 WordPress 中添加按钮。
  3. 在 WordPress 中添加按钮而不使用简码。

在这三个选项中,第一个是编码方法。您需要编写 HTML / CSS 代码并将其添加到您的网站中任何需要按钮的地方。它不适合初学者。

第二种方法是最常用的方法。这是因为大多数 WordPress 按钮插件都提供了用于添加按钮的简码。

第三个选项是最好的,因为它允许您轻松地向帖子和页面添加按钮,而无需记住短代码。

让我们看看如何在 WordPress 中添加按钮而不使用短代码。

您需要做的第一件事是安装并激活“忘记短代码按钮”插件。有关更多详细信息,请参阅我们有关如何安装 WordPress 插件的分步指南。

激活插件后,创建一篇新帖子或编辑现有帖子。在编辑器中,您将在可视化编辑器中看到一个标记为“插入按钮”的新按钮。

在经典 WordPress 编辑器中插入按钮图标

要在帖子中插入新按钮,您需要单击“插入按钮”图标。

这将弹出一个弹出窗口,您可以在其中设计新按钮。

在经典编辑器中输入按钮文本和 URL

首先,您需要添加按钮文本和 URL。添加按钮文本时,您可以在下面的框中看到实时预览。

接下来,您可以向链接添加 nofollow 标记,并通过单击下面的复选框选项在新选项卡中打开链接。

之后,您可以为按钮选择一个图标。如果单击“图标”选项卡,您将能够看到可以在按钮中的文本之前或之后添加的图标。

在经典编辑器中将图标添加到按钮

这些图标实际上是图标字体(了解如何在 WordPress 帖子编辑器中使用图标字体)。

接下来,您可以通过单击颜色框图标来选择按钮的文本颜色和背景颜色。

在 WordPress 经典编辑器中更改按钮背景颜色

之后,单击下拉菜单选择按钮样式。

有八种不同的按钮样式可供使用。

在经典 WordPress 编辑器中选择按钮样式

同样,您也可以选择从超小到超大的按钮尺寸。

一旦您对外观感到满意,只需单击“更新”按钮即可。

您将能够在帖子编辑器内看到帖子中显示的按钮。

您还可以通过简单地选择按钮文本并使用经典编辑器中的工具栏按钮来设置按钮对齐方式。

在经典编辑器中居中对齐按钮

双击该按钮将弹出“插入按钮”弹出窗口,您可以根据需要重新编辑按钮。

一旦您对其设计感到满意,您就可以发布或更新您的帖子并查看其实际效果。这就是我们的演示WordPress 网站上精美按钮的显示方式。

按钮预览 - 内置经典编辑器

在 WordPress 中添加点击通话按钮

除了常见的号召性用语按钮之外,您还可以在网站上添加点击通话按钮以增加潜在客户和转化率。

点击通话按钮是一种特定类型的号召性用语按钮,用户只需轻按一下即可向您的团队拨打电话。

使用点击通话按钮,您的网站访问者可以立即与您的团队亲自交谈并获取他们所需的信息。无论是讨论报价请求、预售信息还是支持问题,电话都非常快捷。

随着智能手机用户数量的不断增长,添加“立即通话”按钮现在变得更加重要。

如果您没有商务电话,那么您可能需要考虑获取虚拟商务电话号码

话虽如此,让我们逐步看看如何在 WordPress 中添加点击通话按钮。

您需要做的第一件事是安装并激活WP Call Button插件。有关详细说明,您可以参阅我们有关如何安装 WordPress 插件的分步指南。

激活后,您需要访问“设置”»“WP 呼叫按钮”页面来配置插件设置并设计您的点击呼叫按钮。

WordPress 中的粘性呼叫按钮设置

首先,您将看到粘性呼叫按钮设置。粘性呼叫按钮是一项针对转化进行优化的功能,可在用户浏览您的网站时将呼叫按钮与用户一起移动。

您可以通过激活“立即呼叫”按钮状态来开始。只需单击开关即可激活它。

之后,您需要输入您的电话号码。WP 呼叫按钮有一个带有您的国家/地区代码的智能电话号码字段。只需选择您所在的国家/地区并输入您的公司电话号码。

如果您没有公司号码,则可以从Nextiva获取一个。它是值得信赖的企业 VoIP 提供商

接下来,您可以编辑呼叫按钮文本并选择呼叫按钮位置和颜色。

此外,您还可以选择在网站上的何处显示粘性呼叫按钮。默认情况下,它在所有页面和所有设备上显示通话按钮。您可以在某些页面上显示或隐藏该按钮,并仅在移动设备上显示该按钮。

查看所有选项后,您可以单击底部的“保存更改”按钮。之后,您可以访问您的网站并查看正在运行的粘性呼叫按钮。

WordPress 点击呼叫按钮

除了粘性呼叫按钮之外,您还可以使用此插件在 WordPress 页面、帖子和侧边栏上添加静态呼叫按钮。

如果您使用的是 WordPress 块编辑器,则可以使用 WP 呼叫按钮块轻松在页面上添加立即呼叫按钮。

创建新页面或编辑现有页面并使用页面编辑器添加 WP 呼叫按钮块。

在 WordPress 中添加 WP 呼叫按钮块

之后,您可以自定义按钮文本、按钮颜色、文本颜色和字体大小以及显示或隐藏电话图标。

一旦您对其设计感到满意,您就可以发布或更新您的页面。

在 WordPress 页面编辑器中自定义呼叫按钮

如果您使用的是经典 WordPress 编辑器,那么您需要使用静态调用按钮生成器来获取短代码。

转到设置 » WP 呼叫按钮,然后单击顶部的“静态呼叫按钮”菜单。

WordPress 设置中的静态呼叫按钮

只需自定义按钮选项,然后复制短代码即可。之后,您可以在网站上的任何帖子或页面中使用短代码。

WP 呼叫按钮插件还允许您在 WordPress 侧边栏和其他小部件就绪区域添加呼叫按钮。

只需转到外观 » 小部件,然后将 WP 呼叫按钮小部件拖动到要显示呼叫按钮的小部件就绪区域。

WordPress 呼叫按钮侧边栏小部件

现在,您可以添加标题、描述,并从“高级设置”部分自定义呼叫按钮。完成后,保存您的小部件。

就是这样!如果您想查看更详细的教程,可以查看我们的分步指南,了解如何在 WordPress 中添加点击通话按钮

在 WordPress 中添加自定义按钮的额外提示

如果您想在 WordPress 中添加完全自定义的号召性用语按钮,那么您可能正在寻找一种解决方案,该解决方案还允许您在网站标题、菜单和其他区域中添加自定义部分以及自定义按钮。

在这种情况下,我们建议使用拖放式WordPress 页面构建器插件,例如SeedProdThrive Architect。

这些页面构建器将帮助您按照您想要的方式创建带有精美号召性用语按钮的自定义登录页面。

无论您做什么,跟踪按钮的表现都很重要,因为猜测并不是最好的业务增长策略。

我们建议使用MonsterInsights。它具有针对联属链接、出站链接和自定义事件的内置事件跟踪,因此您可以查看按钮的性能。有关更多详细信息,请参阅您必须在 WordPress 中跟踪的重要营销指标

我们希望本文能帮助您轻松学习如何在 WordPress 中添加按钮。您可能还想查看我们有关WordPress 转化跟踪的完整指南或用于发展您的网站的最佳 WordPress 插件列表。

发表评论

您的电子邮箱地址不会被公开。 必填项已用*标注

Scroll to Top