WordPress 簡碼完整指南

在 WordPress 塊編輯器之前，WordPress 短代碼是使用 WordPress 編輯器的最佳工具之一，它可以更輕鬆地向 WordPress 網站的頁面、帖子和其他部分添加插件和主題功能。

隨著移動到塊編輯器，這對於大多數仍然充滿短代碼的舊插件和網站意味著什麼？ WordPress 短代碼仍然有效嗎？ 有沒有辦法輕鬆地從使用 WordPress 短代碼轉移到 WordPress 塊？

讓我們來了解一下。 在本指南中，我們將探索 WordPress 塊編輯器時代的 WordPress 短代碼。

什麼是 WordPress 簡碼？

WordPress 短代碼是一種可重用的動態代碼，包含在[brackets] 中。 短代碼允許您輕鬆地將 WordPress 本身或插件或主題的特定功能插入任何帖子、頁面、自定義帖子類型或小部件。 想想 WordPress 簡碼，如“快捷方式”或您網站上的宏。

您可以使用 WordPress 短代碼來顯示靜態內容，這些內容太繁瑣而無法繼續編碼和重複。 您還可以使用短代碼來顯示動態內容，例如圖片庫、播客的音頻播放器、事件日曆或某些數據的更改統計信息。

簡碼格式

在插入短代碼時，基本的[括號]格式可以通過多種方式“擴展”，允許您自定義或添加稱為屬性的附加設置信息。 此外，快捷方式可以包裝文本（或 HTML），甚至可以嵌套在另一個短代碼中。

例如，短代碼可以具有以下格式：

[shortcode]

[shortcode]Some text[/shortcode]

[shortcode]<a href="http://mysite.com/">HTML content</a>[/shortcode]

[shortcode]Some text [another-shotcode] more text [/shortcode]

[shortcode icon="icon: star" background="#eeeeee" color="#F73F43" text_color="#F73F43" size="32" shape_size="16" radius="256" text_size="16" url="#" target="self" margin="0"] This is a custom icon [/shortcode]

簡碼屬性

簡碼也很靈活，因為它們可以使用屬性進行擴展。 通過屬性，簡碼只需在簡碼中添加額外的代碼片段即可提供額外的自定義。

插件和主題提供了額外的指南和準則，以幫助用戶使用正確的短代碼片段在輸出中添加或刪除某些元素。

以下是一些帶有屬性的短代碼示例。

[[gallery id="123" size="medium"]]

[recent-posts posts="5"]

[recent-posts posts="5"]Posts Heading[/recent-posts]

內置 WordPress 簡碼

WordPress 帶有幾個內置的短代碼，用於呈現某些類型的內容。

[[audio]]

音頻短代碼允許您嵌入音頻文件並播放它們。

[[caption]]

標題簡碼主要用於單個圖像，允許您在內容周圍環繞標題。

[[gallery]]

圖庫簡碼允許您將一個或多個圖片庫添加到您的帖子和頁面。

[[embed]]

嵌入短代碼允許您以最大（但不固定）的寬度和高度包裝嵌入的項目。

[[playlist]]

播放列表短代碼實現了在帖子中顯示 WordPress 音頻或視頻文件集合的功能。

[[video]]

視頻短代碼允許您嵌入視頻文件並播放它們。

插件和主題短代碼

特定的 WordPress 主題和插件具有開箱即用的短代碼，您可以將其插入帖子或頁面編輯器中，並將在前端呈現結果。 迄今為止，許多主題和插件仍在使用短代碼。

例如，簡碼通常用於日曆、表格、表格、會員、倒數計時器或拉引號的常見插件中。 甚至存在短代碼插件，允許您為任何內容創建短代碼。

WordPress 主題還可以利用短代碼來呈現某些預先設計好的或由它們提供的動態內容。

自定義簡碼

大多數專業開發人員選擇創建自己的短代碼，從本質上減少編寫重複代碼所需的時間。 只需在文件目錄中添加一個簡單的附加文件即可創建custom-shortcodes.php 文件。 如果您想了解自定義短代碼的訣竅，請參閱有關創建自定義短代碼的指南。

WordPress 簡碼 API

對於創建自己的自定義短代碼的開發人員，WordPress Shortcode API 提供了一組簡單的函數來創建用於帖子和頁面的 WordPress 短代碼。

Shortcode API 幫助插件開發人員創建動態內容，用戶可以通過將相應的短代碼添加到內容區域來添加到頁面或帖子中。 值得慶幸的是，API 處理所有復雜的解析，無需為每個短代碼編寫自定義正則表達式。 此外，還包括用於設置和獲取默認短代碼屬性的輔助函數。

開發人員可以查看 WordPress Shortcode API 文檔以了解更多信息：

• 處理屬性
• 輸出
• 封閉與自封閉短代碼
• 功能參考
• 限制
• 正式語法

經典編輯器中的短代碼

過去，短代碼被插入到任何帖子或頁面的經典編輯器中，如下所示：

什麼是 WordPress 塊？

首先是簡碼……但後來出現了基於塊的編輯。 隨著 WordPress 5.0 的推出，計劃已久的古騰堡編輯器或 WordPress 塊編輯器作為 WordPress 的主頁和帖子編輯器得以實施，取代了已經存在多年的經典 WordPress 基於文本的編輯器。

下面是 WordPress 5.5 之前的內容編輯器（啊，那些日子！）

Gutenberg 編輯器最初是在 WordPress 的早期版本中發布的，但在 WordPress 5.0 成為默認編輯器之​​前一直是可選的。

新的被阻止的編輯器本身沒有任何問題。 事實上，大多數用戶都喜歡 WordPress 後端經過改進、更乾淨、更不令人生畏的外觀。

但是隨著 WordPress 塊編輯器出現了 WordPress塊。 頂部的格式選項讓人想起 Microsoft Word 等文字處理應用程序已經一去不復返了。 相反，格式選項已被每個塊的選項卡式右側邊欄選項替換。

WordPress 塊本質上是內容容器。 不同類型的內容有許多不同的塊——圖像、視頻、文本、標題、畫廊——你可以說出它的名字。

甚至還有一個用於格式化、間隔和分隔符的 WordPress 塊，它們隨意排列在類別中以便於訪問。

頂部的所有選項和控件現在都位於頁面/帖子編輯器的右側，頂部的選項卡指示您是要單獨查看當前塊還是整個文檔的選項。

塊編輯器更簡單、更快速、更用戶友好。 此外，主題和插件開發人員也在製作自己的塊，為默認的 WordPress 塊添加更多的塊選項。

可重用塊與短代碼

在 WordPress 經典編輯器中保存一組預定義輸出的舊方法是通過創建自己的短代碼。 現在，這種方法已被可重用的塊取代。

保存預定義和預定制塊的能力也使得保存某個塊的佈局和設計並在另一個塊上使用它變得更加容易。 很像頁面模板。

例如，如果您添加一個按鈕塊並使用特定顏色、懸停效果等對其進行樣式設置，您不會希望在添加該按鈕的每個頁面上都繼續這樣做。 如果您將其更改為可重複使用的塊，該按鈕將保存在您的 WordPress 網站上，並成為您可以在其他頁面或帖子上使用的自己的塊。

您還可以通過將這些塊轉換為常規塊、將其另存為新塊（使用新名稱）或更新塊的現有設計來進一步更新這些塊。

組塊

在 WordPress 5.3 中還引入了組塊和模板。

從本質上講，您可以將某些塊組合在一起並一起移動或更新它們。 這最終導致了塊模式。 塊模式使編輯內容變得更加容易，因為用戶更願意選擇一種模式並更新內容，而不是從空白畫布開始。

塊樣式選項

每個主題都有不同的風格選擇。 通常，您在每個站點上添加的內容樣式是由您的主題預先確定的。

使用塊編輯器，您可以選擇單獨更新每個塊的樣式，以突出顯示或使其更加引人注目。

塊和完整站點編輯

隨著我們在 WordPress 上創建和構建頁面方式的所有這些進步和變化，產生了想法並最終過渡到所謂的完整站點編輯。

在粘貼中，大多數用戶只能更新帖子或頁面的實際正文。 網站的某些方面，例如頁眉、頁腳、側邊欄和小部件，仍然在很大程度上取決於主題。 這當然使尋找具有適量選項的完美主題成為 WordPress 開發人員和用戶的終極鬥爭。

隨著完整站點編輯和 Block Builder 的引入，趨勢正在朝著使頁面或帖子的所有部分都可編輯的方向發展，在某種程度上，使用塊。

例如，最新的 20-20 WordPress 主題遵循這種模式，讓創建者和網站所有者更好地控制他們的網站以及他們希望它的外觀。

展望未來，插件和主題開發人員在開發軟件時需要採用不同的方法，以適應 WordPress 塊編輯器的全新完整站點編輯和頁面構建體驗。 雖然此功能的全面應用仍在進行中，但這是一個我們可能會早日看到的積極變化。

新的簡碼塊

在塊編輯器之前，短代碼被直接插入到頁面或頁面編輯器中。 現在，WordPress 塊編輯器包含一個新的短代碼塊。

短代碼塊可以輕鬆地在帖子或頁面中繼續使用舊的短代碼，並保持短代碼輸出的完整性。

通過單擊“添加塊”按鈕，可以將短代碼塊添加到頁面或帖子中。 或者，您可以輸入 /shortcode 並按 Enter。

您會注意到，與其他常見塊不同，短代碼塊在塊工具欄或編輯器側欄中不包含任何特定設置，這可能是因為可以使用其屬性自定義短代碼。

塊編輯器對 WordPress 短代碼意味著什麼？

WordPress 塊編輯器對短代碼有重大影響。 讓我們介紹一些關於塊編輯器時代 WordPress 短代碼需要注意的最重要的事情。

1. WordPress 塊編輯器從根本上改變了大多數插件和主題的短代碼的需求和目的。 使用基於塊的編輯系統，頁面上的每個“元素”都有自己的塊，而不是包含在一個可編輯的 WYSIWYG 編輯器中。

由於塊編輯器是一種完全不同的撰寫帖子或頁面的方法，因此由短代碼生成的頁面中更動態的部分可以作為可以單獨添加的塊存在。

2. 塊現在可以代替大多數短代碼，用戶無需學習如何使用短代碼。 對於某些用戶來說，短代碼的概念和格式可能具有陡峭的學習曲線，因此塊方法可能更容易。

例如，採用 Gravity Forms 插件。 在塊編輯器之前，將表單插入帖子或頁面的過程是不同的。 在經典編輯器中，您必須使用按鈕將表單插入到您的內容中。

選擇表單後，表單短代碼已添加到您的內容中。 根據您選擇的選項，短代碼包含標題和描述的屬性。

現在，Gravity Forms 插件提供了一個表單塊嵌入塊。 從塊編輯器中，選擇 Forms 塊。

選擇表單後，您實際上會更好地預覽表單在頁面上的外觀。 表單設置可以在塊設置中找到。

3. 主題和插件開發人員需要決定他們的短代碼實現的未來並將他們的短代碼轉換為塊。 如上所述，數百個主題、插件和開發人員仍然在他們的網站和應用程序上使用短代碼。 區塊採用可能會很慢，但隨著用戶對新區塊編輯器越來越熟悉，用戶很可能會請求區塊選項。

對於那些距離採用 WordPress 塊編輯系統還有數英里的開發人員來說，完整站點編輯概念可以與他們的短代碼齊頭並進。 諸如評論和評級插件、音頻播放器、日期行情、畫廊、聯繫表格以及大多數其他仍然使用短代碼的插件仍然“在遊戲中”。

4. 短代碼不會很快消失。 這可能就是 WordPress 塊編輯器提供短代碼塊以幫助維護短代碼使用的原因。 因為在 WordPress 5.0 和塊編輯器之前，簡碼有如此廣泛的使用和實現，重要的是 WordPress 的未來版本仍然支持簡碼。

5. 短代碼可以轉換為塊。 有使用短代碼的最喜歡的主題或插件嗎？ 這些短代碼很可能會在某個時候轉換為塊。 如果您是插件或主題的開發人員，或者您構建 WordPress 網站並在自定義主題中使用短代碼，則可以將短代碼重新考慮為塊。

在下一節中，我們將簡要介紹如何將 WordPress 短代碼轉換為 WordPress 塊。

如何將 WordPress 簡碼轉換為 WordPress 塊

正如您可以添加自定義短代碼和可重用塊一樣，您也可以輕鬆地將自定義 WordPress 短代碼轉換為 WordPress 塊。

按照此自定義短代碼指南中的第一步操作。

以 Caldera Forms 中的這個基本示例為例：

 <?php /** * Handler for [cl_post_title] shortcode * * @param $atts * * @return string */ function caldera_learn_basic_blocks_post_title_shortcode_handler($atts) { $atts = shortcode_atts([ 'id' => 0, 'heading' => 'h3', ], $atts, 'cl_post_title'); return caldera_learn_basic_blocks_post_title($atts[ 'id' ], $atts[ 'heading' ]); } /** * Output the post title wrapped in a heading * * @param int $post_id The post ID * @param string $heading Allows : h2,h3,h4 only * * @return string */ function caldera_learn_basic_blocks_post_title($post_id, $heading) { if (!in_array($heading, ['h2', 'h3', 'h4'])) { $heading = 'h2'; } $title = get_the_title(absint($post_id)); return "<$heading>$title</$heading>"; } /** * Register Shortcode */ add_shortcode('cl_post_title', 'caldera_learn_basic_blocks_post_title_shortcode_handler');

此代碼採用帖子 ID 和標題級別（h2、h3、he）並輸出包含在標題 HTML 中的帖子標題。

完成並測試代碼是否正常工作後，您必須將短代碼註冊為一個塊。 以下是將 WordPress 簡碼轉換為 Gutenberg 塊的分步指南作為示例。

有關創建 WordPress 塊的更多資源

有許多在線插件和資源可以幫助您完成這一步，包括來自 WordPress 的關於編寫您的第一個塊類型的官方文檔。 您也可以查看 Igor Benic 的帖子，了解如何創建用於顯示帖子的塊。

閱讀這些指南後，您將能夠弄清楚如何使用自定義短代碼創建自己的 WordPress 塊。

WordPress 短代碼的裁決

WordPress 短代碼現在並將仍然是 WordPress 最重要的部分之一。 短代碼幫助許多插件開發人員使他們的插件更加用戶友好，並且許多主題開發人員擴展了他們主題的功能。 短代碼還減少了許多內容創建者和網站所有者在創建自定義短代碼後反复添加和更新他們想要的東西時所遇到的麻煩。

話雖如此，毫無疑問，塊編輯器是 WordPress 編輯體驗的未來，所以期待看到更多的開發人員做出貢獻，使其更好，功能更豐富，包括那些仍在使用短代碼的人。 展望未來，我們預計更多的開發人員將過渡到使用和添加 WordPress 塊而不是 WordPress 短代碼。

我們希望您已經了解了 WordPress 短代碼的重要性、它們的用途以及何時使用它們。 希望您可以開始創建自己的自定義短代碼，並最終創建自己的塊，這兩者肯定不會很快消失。

克里斯汀·賴特

自 2011 年以來，Kristen 一直在編寫教程來幫助 WordPress 用戶。您通常會發現她在為 iThemes 博客撰寫新文章或為 #WPprosper 開發資源。 工作之餘，克里斯汀喜歡寫日記（她寫了兩本書！）、遠足和露營、烹飪以及與家人一起進行日常冒險，希望過上更現代的生活。