如何在 WordPress 文章和頁面中添加自定義按鈕:詳細(xì)分步教程

圖片[1]-如何在 WordPress 文章和頁面中添加自定義按鈕:詳細(xì)分步教程-光子波動(dòng)網(wǎng) | 專業(yè)WordPress修復(fù)服務(wù),全球范圍,快速響應(yīng)

WordPress 內(nèi)置按鈕塊讓添加按鈕變得非常簡單,這是 Gutenberg WordPress 塊編輯器引入的一項(xiàng)功能。本文將向你展示如何在 WordPress 博客文章和頁面中添加號(hào)召性用語按鈕的多種方法??梢赃x擇最適合你需求的解決方案。

使用默認(rèn)編輯器在 WordPress 文章/頁面中添加按鈕

這種方法簡單易用,適合所有用戶。它使用 WordPress 塊編輯器中內(nèi)置的“按鈕”塊。如果你仍在使用較舊的經(jīng)典編輯器,可以跳到下一部分。

1、選擇頁面

需要創(chuàng)建一個(gè)新帖子編輯現(xiàn)有帖子以添加按鈕。

圖片[2]-如何在 WordPress 文章和頁面中添加自定義按鈕:詳細(xì)分步教程-光子波動(dòng)網(wǎng) | 專業(yè)WordPress修復(fù)服務(wù),全球范圍,快速響應(yīng)

在帖子編輯屏幕上,點(diǎn)擊“+”圖標(biāo)并從布局元素部分中選擇按鈕塊。

圖片[3]-如何在 WordPress 文章和頁面中添加自定義按鈕:詳細(xì)分步教程-光子波動(dòng)網(wǎng) | 專業(yè)WordPress修復(fù)服務(wù),全球范圍,快速響應(yīng)

2、添加按鈕塊

接下來,應(yīng)該能看到按鈕塊已添加到內(nèi)容編輯器中。只需點(diǎn)擊“添加文本…”區(qū)域并輸入按鈕文本。

圖片[4]-如何在 WordPress 文章和頁面中添加自定義按鈕:詳細(xì)分步教程-光子波動(dòng)網(wǎng) | 專業(yè)WordPress修復(fù)服務(wù),全球范圍,快速響應(yīng)

3、添加按鈕文本

然后,點(diǎn)擊工具欄中的鏈接按鈕添加鏈接。可以搜索帖子或頁面,或簡單地復(fù)制并粘貼 URL 到鏈接字段中。完成后,按“Enter”或點(diǎn)擊“應(yīng)用”圖標(biāo)保存鏈接。

圖片[5]-如何在 WordPress 文章和頁面中添加自定義按鈕:詳細(xì)分步教程-光子波動(dòng)網(wǎng) | 專業(yè)WordPress修復(fù)服務(wù),全球范圍,快速響應(yīng)

4、添加按鈕鏈接

如果要將按鈕居中顯示,可以點(diǎn)擊“對(duì)齊”圖標(biāo),然后選擇“居中對(duì)齊”。還可以從工具欄更改按鈕的垂直對(duì)齊方式。

圖片[6]-如何在 WordPress 文章和頁面中添加自定義按鈕:詳細(xì)分步教程-光子波動(dòng)網(wǎng) | 專業(yè)WordPress修復(fù)服務(wù),全球范圍,快速響應(yīng)

5、更改按鈕對(duì)齊方式

接下來,可以從右側(cè)的塊設(shè)置面板自定義按鈕樣式并更改文本和背景顏色。只需切換到塊設(shè)置下的“樣式”選項(xiàng)卡即可調(diào)整按鈕樣式。

圖片[7]-如何在 WordPress 文章和頁面中添加自定義按鈕:詳細(xì)分步教程-光子波動(dòng)網(wǎng) | 專業(yè)WordPress修復(fù)服務(wù),全球范圍,快速響應(yīng)

6、更改按鈕樣式

有三種按鈕樣式可供選擇:默認(rèn)、輪廓和方形。顏色設(shè)置部分包括按鈕背景和文本的五種顏色變化。還可以通過點(diǎn)擊“自定義顏色”選項(xiàng)選擇自定義顏色。對(duì)按鈕設(shè)計(jì)滿意后,保存或發(fā)布你的帖子以查看實(shí)時(shí)預(yù)覽。

圖片[8]-如何在 WordPress 文章和頁面中添加自定義按鈕:詳細(xì)分步教程-光子波動(dòng)網(wǎng) | 專業(yè)WordPress修復(fù)服務(wù),全球范圍,快速響應(yīng)

在經(jīng)典編輯器中創(chuàng)建 WordPress 按鈕

默認(rèn)的 WordPress 塊編輯器更現(xiàn)代、更快速。一些用戶仍在使用舊的經(jīng)典 WordPress 編輯器。我們不建議使用經(jīng)典編輯器,因?yàn)樗δ苡邢蓿堰^時(shí)。

如果仍在使用經(jīng)典編輯器,可以通過以下三種方法在 WordPress 中添加按鈕:

  1. 使用 HTML/CSS 代碼添加按鈕。
  2. 使用按鈕短代碼插件添加按鈕。
  3. 不使用短代碼添加按鈕。

1、使用 Forget About Shortcode Buttons 插件

推薦的第三種方法是使用插件。首先,在儀表板安裝并激活 Forget About Shortcode Buttons 插件。激活插件后,創(chuàng)建新帖子或編輯現(xiàn)有帖子。在編輯器中,點(diǎn)擊“插入按鈕”圖標(biāo)。

2、插入按鈕圖標(biāo)

將彈出一個(gè)窗口,您可以在其中設(shè)計(jì)新按鈕。首先,添加按鈕文本和 URL。接下來,可以向鏈接添加 nofollow 標(biāo)簽,并選擇在新選項(xiàng)卡中打開鏈接。

圖片[9]-如何在 WordPress 文章和頁面中添加自定義按鈕:詳細(xì)分步教程-光子波動(dòng)網(wǎng) | 專業(yè)WordPress修復(fù)服務(wù),全球范圍,快速響應(yīng)

3、選擇按鈕圖標(biāo)和顏色

還可以選擇按鈕圖標(biāo)、文本顏色和背景顏色,選擇按鈕樣式和尺寸。完成后,點(diǎn)擊“更新”按鈕,按鈕將插入到帖子中。

圖片[10]-如何在 WordPress 文章和頁面中添加自定義按鈕:詳細(xì)分步教程-光子波動(dòng)網(wǎng) | 專業(yè)WordPress修復(fù)服務(wù),全球范圍,快速響應(yīng)

4、按鈕對(duì)齊

可以通過選擇按鈕文本并使用編輯器中的工具欄按鈕設(shè)置按鈕對(duì)齊。對(duì)其設(shè)計(jì)滿意后,發(fā)布或更新帖子查看實(shí)際效果。

圖片[11]-如何在 WordPress 文章和頁面中添加自定義按鈕:詳細(xì)分步教程-光子波動(dòng)網(wǎng) | 專業(yè)WordPress修復(fù)服務(wù),全球范圍,快速響應(yīng)

在 WordPress 中添加點(diǎn)擊通話按鈕

點(diǎn)擊呼叫按鈕是一種特定類型的號(hào)召性用語按鈕,用戶只需點(diǎn)擊即可致電您的團(tuán)隊(duì)。這對(duì)于增加潛在客戶和轉(zhuǎn)化率非常有效。

1、安裝 WP Call Button 插件

首先,安裝并激活 WP Call Button 插件。激活后,訪問設(shè)置?WP Call Button 頁面配置插件設(shè)置并設(shè)計(jì)點(diǎn)擊通話按鈕。

圖片[12]-如何在 WordPress 文章和頁面中添加自定義按鈕:詳細(xì)分步教程-光子波動(dòng)網(wǎng) | 專業(yè)WordPress修復(fù)服務(wù),全球范圍,快速響應(yīng)

2、配置粘性呼叫按鈕

在“粘性呼叫按鈕”設(shè)置中,激活“立即呼叫”按鈕狀態(tài),輸入電話號(hào)碼,編輯呼叫按鈕文本,選擇按鈕位置和顏色。

3、自定義按鈕設(shè)置

可以自定義按鈕文本、顏色、圖標(biāo)等,選擇在網(wǎng)站的哪些頁面和設(shè)備上顯示粘性呼叫按鈕。保存更改后,訪問網(wǎng)站查看按鈕效果。

4、添加靜態(tài)呼叫按鈕

還可以使用插件在 WordPress 頁面、帖子和側(cè)邊欄上添加靜態(tài)呼叫按鈕。在塊編輯器中添加 WP Call Button 塊并自定義按鈕設(shè)計(jì)。如果使用經(jīng)典編輯器,可以使用短代碼生成器獲取短代碼,然后將其添加到帖子或頁面中。

圖片[13]-如何在 WordPress 文章和頁面中添加自定義按鈕:詳細(xì)分步教程-光子波動(dòng)網(wǎng) | 專業(yè)WordPress修復(fù)服務(wù),全球范圍,快速響應(yīng)

5、添加小部件

將 WP 呼叫按鈕小部件拖到側(cè)邊欄或其它小部件區(qū)域,保存設(shè)置。

圖片[14]-如何在 WordPress 文章和頁面中添加自定義按鈕:詳細(xì)分步教程-光子波動(dòng)網(wǎng) | 專業(yè)WordPress修復(fù)服務(wù),全球范圍,快速響應(yīng)

在 WordPress 中添加自定義按鈕提示

僅添加按鈕不夠,可能還需要使用英雄圖像、菜單和自定義布局來自定義頁面。推薦使用拖放式 WordPress 頁面構(gòu)建器插件,如 SeedProdThrive Architect。這些構(gòu)建器可以幫助你創(chuàng)建帶有精美的號(hào)召性用語按鈕自定義頁面。

總結(jié):

本文詳細(xì)介紹了如何在 WordPress 文章和頁面中添加號(hào)召性用語按鈕的多種方法。無論是使用默認(rèn)的 Gutenberg 塊編輯器,還是經(jīng)典編輯器,都有多種選擇供你使用。你可以通過內(nèi)置按鈕塊、插件如 Forget About Shortcode Buttons 和 WP Call Button 等方式添加自定義按鈕和點(diǎn)擊通話按鈕。


聯(lián)系我們
教程看不懂?聯(lián)系我們?yōu)槟赓M(fèi)解答!免費(fèi)助力個(gè)人,小企站點(diǎn)!
客服微信
客服微信
電話:020-2206-9892
QQ咨詢:1025174874
郵件:info@361sale.com
工作時(shí)間:周一至周五,9:30-18:30,節(jié)假日休息
? 轉(zhuǎn)載聲明
本文作者:xiesong
THE END
喜歡就支持一下吧
點(diǎn)贊0 分享
評(píng)論 搶沙發(fā)

請(qǐng)登錄后發(fā)表評(píng)論

    暫無評(píng)論內(nèi)容