如何在 WordPress 中輕鬆新增短代碼

已發表: 2024-02-05

短程式碼是方便的程式碼片段,您可以將其添加到 WordPress 貼文和頁面中,以添加強大的功能,而無需編寫任何 PHP。

它們就像強大的工具,讓您可以嵌入表單、顯示滑桿或建立自訂按鈕,所有這些都只需一行簡單的程式碼。

在這篇文章中,我們將向您展示如何在 WordPress 中添加短代碼以及如何在您的內容中使用它們。

那麼,事不宜遲,讓我們開始吧。

目錄

  1. 了解簡碼
  2. 為什麼在 WordPress 中使用短代碼?
  3. 在 WordPress 中加入短代碼的方法
    • 使用區塊編輯器新增簡碼 (Gutenberg)
    • 使用經典編輯器新增短代碼
    • 在 WordPress 小工具中新增短代碼
    • 在 WordPress 主題檔案中新增短代碼
  4. 如何在 WordPress 中建立自訂簡碼
  5. 經常問的問題
  6. 結論

1了解簡碼

短代碼提供了一種方便的解決方案,可以透過各種功能增強您的 WordPress 網站,從而無需複雜的 HTML 或 CSS 編碼。

這些短代碼括在方括號中。 例如,如果您使用 Rank Math SEO 外掛程式設定本地 SEO,則需要使用短代碼來顯示您的業務訊息,如下所示:

 [rank_math_contact_info]

您只需將其插入 WordPress 貼文、頁面或小部件的內容編輯器中,當在前端查看頁面時,短代碼將被預期功能取代。

想像一下想要在您的網站上新增聯絡表單。 您無需從頭開始編碼整個表單,只需使用外掛程式或主題提供的短代碼即可。 此短代碼會自動產生表單,為您節省寶貴的時間和精力。

但是,如果您需要在貼文中為相關貼文、橫幅廣告、聯絡表單、圖庫或其他元素自訂程式碼怎麼辦? 這就是 Shortcode API 的用武之地。

Shortcode API 可讓開發人員將其程式碼註冊為短代碼,使用戶無需具備編碼知識即可使用它。 當 WordPress 偵測到短程式碼時,它會毫不費力地執行關聯的程式碼。

2為什麼在 WordPress 中使用短代碼?

您可能會因為以下幾個原因想要在 WordPress 網站上新增短代碼:

  • 易於使用:即使您沒有編碼經驗,您仍然可以使用短代碼為您的網站添加強大的功能。
  • 多功能:幾乎所有您能想到的東西都有簡碼,從新增聯絡表單到顯示滑桿和建立自訂按鈕。
  • 便攜式:如果您切換主題或插件,並且產生短代碼的主題或插件保持活動狀態,您的短代碼仍然有效。

在 WordPress 中新增短代碼的3 種方法

現在,讓我們來討論一下為 WordPress 網站新增短程式碼的方法。

3.1使用區塊編輯器新增簡碼 (Gutenberg)

若要使用區塊編輯器新增短代碼,請先導覽至「頁面」「貼文」部分,具體取決於您要新增短代碼的位置。

在區塊編輯器中,點擊+圖標,搜尋簡碼區塊,然後將其添加到您的頁面或貼文中,如下所示。

在古騰堡中加入簡碼

新增簡碼區塊後,您將看到一個用於輸入簡碼的欄位。 輸入所需的短代碼,如果需要,請包括短代碼中的任何必要參數。

新增您的簡碼

完成後,發布或更新您的頁面或貼文以使短代碼在您的網站上生效。

3.2使用經典編輯器新增短代碼

要在經典編輯器中新增短代碼,請導航至頁面貼文部分,具體取決於您要新增短代碼的位置。

在經典編輯器中加入簡碼

完成後,按一下「發布/更新」按鈕儲存變更。

3.3在 WordPress 小工具中加入短代碼

您可以在 WordPress 網站的小工具區域中新增短代碼,允許它們顯示在側邊欄、頁腳或頁首。

首先,導覽至 WordPress 儀表板上的外觀 → 小工具。 然後,找到您要插入短代碼的小部件區域。

接下來,點擊+圖標,搜尋簡碼塊,然後將其拖放或點擊將其放置在所需區域中。

在Widget區域添加簡碼

新增短代碼區塊後,您可以在該區域插入所需的短代碼。

新增簡碼

然後,儲存更改,現在短代碼將在您選擇的小部件區域中處於活動狀態。

3.4在 WordPress 主題檔中加入短代碼

WordPress 主題檔案中的短代碼可以為您的網站添加自訂功能,而無需依賴外掛程式。

為此,請造訪要新增短程式碼的主題文件,例如 page.php、single.php 或自訂模板文件,並使用 WordPress 提供的do_shortcode函數。

只需將短代碼作為參數傳遞給該函數,它將顯示相應的輸出。

例如,如果您有一個名為[your_shortcode]的短代碼,您可以將其新增至您的主題檔案中,如下所示:

<?php echo do_shortcode("[your_shortcode]"); ?>

在主題檔中加入簡碼

添加短代碼後,請記住儲存變更。

但是,請記住,更新主題時您的變更可能會遺失,因此在向主題檔案新增自訂程式碼時最好使用子主題。

4如何在 WordPress 中建立自訂短代碼

短代碼可以方便地向 WordPress 貼文和頁面添加動態內容或自訂程式碼,但建立自訂短代碼需要編碼技能。

如果您熟悉 PHP,請使用以下模板程式碼。

 // Define a custom shortcode function function custom_shortcode() { // Define the desired functionality $message = 'This is my custom shortcode!'; // Return the output return $message; } // Register the shortcode add_shortcode('my_shortcode', 'custom_shortcode');

在此範例中,我們建立一個短代碼[my_shortcode] ,它將顯示文字“這是我的自訂短代碼!” 在您的網站上。

因此,您可以將此程式碼新增至主題的functions.php 檔案或使用程式碼片段外掛程式。

完成必要的步驟後,您可以使用以下程式碼將短程式碼插入您的貼文、頁面和小工具:

 [my_shortcode]

當您發布或預覽帖子或頁面時,短代碼將替換為函數的輸出。

5常見問題

我可以在多個函數中使用相同的短代碼名稱嗎?

不,每個短代碼必須有唯一的名稱。 對多個短代碼使用相同的名稱可能會導致衝突和不可預測的行為。

簡碼和古騰堡區塊有什麼區別?

短代碼是一種為 WordPress 添加動態內容的傳統方法,利用簡單的標籤系統(如 [my_shortcode])。 另一方面,古騰堡區塊是一種更現代的方法,提供視覺化編輯器和基於區塊的結構。

短代碼是為 WordPress 添加動態內容的唯一方法嗎?

不,短代碼是一種方法。 您也可以使用自訂貼文類型、頁面範本和操作掛鉤將動態內容新增至您的 WordPress 網站。

,結論

在 WordPress 中使用短代碼非常有用,因為它允許您輕鬆插入複雜的函數和腳本,而無需從頭開始編寫所有程式碼。

我們已經討論過使用經典編輯器和古騰堡編輯器在 WordPress 中新增短代碼。 按照以下步驟,您可以輕鬆地將短代碼新增至網站的貼文、頁面和小工具。

保持短代碼名稱的唯一性並避免與其他外掛程式或功能發生衝突非常重要。

此外,測試您的短程式碼以確保它們正常運作並與您的 WordPress 主題和外掛程式保持相容也很重要。

如果您喜歡這篇文章,請透過推文@rankmathseo 告訴我們。