**注意:程式碼未試過在 WordPress 新編輯器 Gutenberg 上使用,加入時請三思。使用前建議備份檔案,以免網站發生問題。
預設的 WordPress 文章編輯界面只有兩行工具列,當中並不包括變更字型和字體大小的選項,但其實只要在 functions.php 中加入一段程式碼,就能顯示第三組工具列,更方便地編輯文章。
以下就是需要的 PHP 程式碼:
function add_editor_buttons($buttons) { $buttons[] = 'fontselect'; $buttons[] = 'fontsizeselect'; $buttons[] = 'backcolor'; $buttons[] = 'underline'; $buttons[] = 'hr'; $buttons[] = 'sub'; $buttons[] = 'sup'; $buttons[] = 'cut'; $buttons[] = 'copy'; $buttons[] = 'paste'; $buttons[] = 'cleanup'; $buttons[] = 'wp_page'; $buttons[] = 'newdocument'; $buttons[] = 'styleselect'; return $buttons; } add_filter("mce_buttons_3", "add_editor_buttons");
然後把以上程式碼貼至 functions.php 便可。步驟如下:
1. 點擊外觀 -> 2.主題編輯器 -> 3. 於右側點選 functions.php -> 4. 貼上程式碼 -> 5. 更新檔案
效果如下:
從中可見,WordPress 編輯文章多個隱藏功能已現啟動,其中包括字型和字體轉換等等,以及簡單的 CSS 編輯器(插入 div, pre 等 HTML 元素)。
其實程式碼原理亦非常簡單。首先建立一個自訂函數(function),引入 buttons 陣列物件,再把需要的功能加入彈列,並回傳一個已更新的 buttons 物件。
然後利用 add_filter() 函數,並分別引入 mce_buttons_3 和 自訂函數中回傳的 buttons 物件,以更新工具列。其中 mce_buttons_3 是 WordPress 預設沒有啟用的工具列。
官方參考: