如何在 WordPress 標題菜單中添加按鈕?

您是否正在考慮向 WordPress 標題菜單添加按鈕的方法?

基本上,添加一個按鈕會產生更明顯的號召性用語。 標題上的按鈕更有可能被用戶訪問,因為它位於帖子的頂部,所以它絕對是用戶訪問頁面後看到的內容之一。

該系統提供了更好的用戶體驗並保持了帖子的排名。 我們將介紹添加按鈕的最簡單方法,並提及適合在 WordPress 標題菜單中添加它們的方法。

在 WordPress 標題菜單中添加按鈕的原因

WordPress 導航菜單中的文本是純文本。 此外,添加按鈕的主要目的是為用戶創建一條簡單的路徑,以實現他們所需的操作,並且只需單擊一下即可將他們引導至特定頁面。

此外,添加按鈕的另一個主要用途是它們很有吸引力,可以立即吸引用戶的注意力。 簡而言之,按鈕突出顯示關鍵點,例如將重要鏈接更改為按鈕通常會使它們更加引人注目。

有一個選項 WordPress 默認情況下在帖子和頁面中添加按鈕。 但是,沒有在導航菜單中添加按鈕的內置選項。 轉向在標題菜單中添加按鈕的步驟:

在標題菜單中添加按鈕的步驟

以下是步驟:

  • 導航到外觀 >> 菜單頁面以添加指嚮導航菜單的鏈接。

  • 單擊右上角的「屏幕選項」,其中會顯示一堆選項,您需要選擇「CSS 類」選項。

  • 接下來,向下滾動直到您到達您的菜單並單擊它以展開您想要變成按鈕的菜單項。 在下一頁上,您將找到一個新的 CSS 類選項,您需要在其中輸入類名。 確保保存菜單。

  • 現在是時候在自定義代碼的幫助下設計一個自定義 CSS 類了。 首先,前往外觀>>自定義。

  • 單擊「Additional CSS」選項卡將其展開,您將找到一個需要添加自定義代碼的框。

  • 複製並粘貼下面提到的代碼作為起點:

. 菜單按鈕 {

背景顏色:#eb5e28;

邊框:1px;

邊框半徑:3px;

-webkit-box-shadow:1px 1px 0px 0px #2f2f2f;

-moz-box-shadow:1px 1px 0px 0px #2f2f2f;

盒子陰影:1px 1px 0px 0px #2f2f2f;

}

.menu-button a, .menu-button a:懸停, .menu-button a:active {

顏色:#fff!重要;

}

  • 您將立即注意到網站預覽中的更改。 但是,在您點擊「發布」按鈕之前,您的真實網站不會有任何變化。

因此,您已成功在 WordPress 標題菜單上添加了一個按鈕。 此外,此方法也適用於突出顯示 WordPress 導航菜單中的任何鏈接。

總結

最後,我們希望本教程能幫助您在 WordPress 導航菜單中添加一個按鈕。 此外,如果您想了解有關導航菜單的更多信息,請訪問我們的文章「如何在您的 WordPress 網站中添加導航菜單?」 了解更多詳細信息。

如何在 WordPress 標題菜單中添加按鈕? 首次出現在 WP HowToPress – 您的 WordPress 指南。

相關文章