很多人看不上 WordPress 的編輯器,因為可用功能實在是少的可憐。由於經常要文章中插入各種代碼,在之前一直使用的編輯器增強插件“CK and SyntaxHighlighter“ 這個編輯器很強大,但是後來發現顯示的代碼高亮與筆者用的模板嚴重不符。由於筆者的博客做了防複製,導致頁面代碼又不能複製,需要一款插件實現代碼高亮並且支持複製!

後來經過百度一下又繼續谷歌兩下下。嘿嘿~終於發現了一款令滿意的代碼高亮插件而且還可以複製代碼。

找到插件了,於是安裝啓用,一看,立刻杯具了,這款插件加上 CK and SyntaxHighlighter 編輯器插件,兩個一起使用,竟然有衝突,寫出的代碼好多是亂碼。測試了下發現代碼高亮的插件只能在默認的編輯器中使用。也就是説我要先卸載 CK and SyntaxHighlighter 編輯器插件才能使用它。天理何在啊。

天生愛折騰的命,這個問題必須解決。

現在擺在面前的問題是,想要使用編輯器插件,就不能使用代碼高亮插件,但是我兩個都需要啊,這種二選一的難題真令人頭痛啊 ,必須找個兩全其美的辦法來解決!

四處尋覓無果。無意看了一下 WordPress 官方的 API 函數。蒼天有眼啊!原來,後台的編輯器可以插入很多增強功能。果斷卸載掉 CK and SyntaxHighlighter 編輯器插件。事實上,WordPress 的編輯器很強大,幾乎包含所有的編輯器按鈕。只是程序默認的功能比較少而已吖!

馬上為自己的 WordPress 默認編輯器添加了常用的實用功能做下測試,效果還真是很不錯的吖。哈哈看圖!

是不是和默認的那個簡陋的編輯器不一樣呢?最後一行功能是用代碼加上的。這些功能默認編輯器是沒有的!只是我們需要把它們調出來加上就可以啦,開始還對這個摸索了不少時間- -,最後發現其實方法超級簡單!

找到你正在使用的那個主題的模版函數文件 (也就是 functions.php 這個文件),在其中加入下面這段代碼:

//增強編輯器開始

function add_editor_buttons($buttons) {

$buttons[] = 'fontselect';

$buttons[] = 'fontsizeselect';

$buttons[] = 'cleanup';

$buttons[] = 'styleselect';

$buttons[] = 'hr';

$buttons[] = 'del';

$buttons[] = 'sub';

$buttons[] = 'sup';

$buttons[] = 'copy';

$buttons[] = 'paste';

$buttons[] = 'cut';

$buttons[] = 'undo';

$buttons[] = 'image';

$buttons[] = 'anchor';

$buttons[] = 'backcolor';

$buttons[] = 'wp_page';

$buttons[] = 'charmap';

return $buttons;

}

add_filter("mce_buttons_3", "add_editor_buttons");

//增強編輯器結束

保存下就可以啦!哈哈,文章啓用防複製,頁面上的代碼是複製不了啦,但是你可以點擊代碼右上角” 查看源代碼“ 按鈕,在彈出的窗口進行復制!

最後,附上搜集的按鈕調用的 Key,也就是説,下面這些功能都可以增加到編輯器裏面,哈哈,夠強大吧!

下面的功能按鈕可以自行添加,你添加更多功能的時候只要把代碼中 “$buttons[] =” 後面單引號內的單詞換成下面括號裏列出的那些 Key 就可以了啦!

還在糾結 WordPress 自帶編輯器功能少的朋友,快去試試看吧!

WordPress 編輯器按鈕調用的 Key:

1. 剪切 (cut) 複製 (copy) 粘貼 (paste) 撤銷 (undo) 重做 (redo) 居中 (justifycenter)

2. 加粗 (bold) 斜體 (italic) 左對齊 (justifyleft) 右對齊 (justfyright)

3. 兩端對齊 (justfyfull) 插入超鏈接 (link) 取消超鏈接 (unlink) 插入圖片 (image)

4. 清除格式 (removeformat) 下劃線 (underline) 刪除線 (strikethrough)

5. 錨文本 (anchor) 新建文本 (newdocument)

6. 字體顏色 (forecolor) 字體背景色 (backcolor)

7. 格式選擇 (formmatselect) 字體選擇 (fontselect) 字號選擇 (fontsizeselect)

8. 樣式選擇 (styleselect) 無序列表 (bullist) 編號列表 (numlist)

9. 減少縮進 (outdent) 縮進 (indent) 幫助 (wp_help)

10 打開 HTML 代碼編輯器 (code) 水平線 (hr) 清除冗餘代碼 (cleanup)

11. 上標 (sub) 下標 (sup) 特殊符號 (charmap) 插入 more 標籤 (wp_more)

12. 插入分頁標籤 (wp_page)

13. 隱藏按鈕顯示開關 (wp_adv)

14. 隱藏按鈕區起始部分 (wp_adv_start)

15. 隱藏按鈕區結束部分 (wp_adv_end)

16. 寫檢查 (spellchecker)