WordPress大學(xué)新發(fā)布的文章都是采用古騰堡編輯器發(fā)布了，像我們這種涉及到代碼分享的教程網(wǎng)站來說，代碼高亮顯示是提高用戶體驗的一個非常重要的措施。雖說目前有不少代碼高亮插件，兼容古騰堡編輯器的也不少，但是真正兼容古騰堡內(nèi)置的【代碼】區(qū)塊的，目前倡萌只發(fā)現(xiàn)有兩個：Code Syntax Block 和 Syntax-highlighting Code Block。
很多代碼插件都是添加了自己的區(qū)塊的，但是如果哪天禁用掉插件后，可能會導(dǎo)致已發(fā)布的文章出現(xiàn)問題，所以，如果是支持默認(rèn)的【代碼】區(qū)塊，即使以后刪除了插件，已發(fā)布的代碼也不會出現(xiàn)問題。這就是倡萌挑選高亮插件的最重要的參考標(biāo)準(zhǔn)。
倡萌最先找到并使用的是 Syntax-highlighting Code Block，但是這個插件不支持添加行號，而且高亮的效果也不太理想。然后昨天找到了 Code Syntax Block，彌補了前者的不足，完全兼容古騰堡的【代碼】區(qū)塊，還支持添加行號，并且高亮效果也很不錯！ Code Syntax Block 采用的是 Prism 這個代碼高亮庫實現(xiàn)的，非常小巧，支持 196種語言，兼容 IE9+、Firefox、Chrome、Safari、Opera 和大多數(shù)的手機端瀏覽器。
下來說下如何使用 Code Syntax Block。
1、在后臺插件安裝界面搜索 Code Syntax Block 進行在線安裝，或者訪問官方發(fā)布網(wǎng)址 下載 Code Syntax Block ，然后上傳安裝。
2、啟用插件以后，在文章發(fā)布界面，插入一個【代碼】區(qū)塊，添加代碼并選中該區(qū)塊，就可以在左邊看到設(shè)置選項：
3、發(fā)布文章以后，效果如下圖所示：
Code Syntax Block 1.1 以上允許我們通過鉤子設(shè)置默認(rèn)的語言，比我下面的代碼就設(shè)置了默認(rèn)語言為php，因為倡萌發(fā)布教程時插入最多的是PHP代碼。將代碼添加到當(dāng)前主題的 functions.php 即可
//設(shè)置默認(rèn)的語言為PHP
function wpkj_code_syntax_default_lang(){
return 'php'; //將php修改為其他語言
}
add_filter( 'mkaz_code_syntax_default_lang', 'wpkj_code_syntax_default_lang' );Code Syntax Block 插件還有提供的空間：
- 設(shè)置特定的代碼行或范圍高亮，方便對代碼進行解說的時候標(biāo)注
- 設(shè)置代碼行數(shù)初始數(shù)，默認(rèn)是從1開始遞增行數(shù)，如果想從21開始呢？
倡萌已將上面的要求告知作者，但愿在以后的版本中，作者可以添加。
