WordPress非插件使用Prism.js實現(xiàn)代碼高亮

對于技術(shù)控的朋友來說，平日總要寫幾段代碼來裝裝逼。
市面上也比較多代碼高亮插件，各種各樣。前端時間蘇醒網(wǎng)站改版也沒集成代碼高亮的功能。今天有點時間就研究了下，發(fā)現(xiàn)Prism.js這個輕量級的JavaScript代碼高亮很好耍！Prism.JS也大部分流行的編程語言，并且支持多種主題樣式，只需要引用CSS文件和JS文件即可完成。
好東西要分享，果斷分享給大家。

第一步：將下面的代碼復(fù)制到funcations.php中。

 function add_prism() {
        wp_register_style(
            'prismCSS',
            get_stylesheet_directory_uri() . '/prism.css' //自定義路徑
         );
          wp_register_script(
            'prismJS',
            get_stylesheet_directory_uri() . '/prism.js'   //自定義路徑
         );
        wp_enqueue_style('prismCSS');
        wp_enqueue_script('prismJS');
    }
add_action('wp_enqueue_scripts', 'add_prism');

以上工作結(jié)束后，就可以實現(xiàn)代碼高亮了。
對，就這么簡單。

第二步：編輯文章時，使用文本模式，輸入下面的代碼。

<pre class="language-c"><code class="language-c"> ?code_here </code></pre>

（language-c中，紅色字體可修改任意語言，但必須保留language-，如language-php）

使用技巧

如果你想每行代碼前帶序號，只需要在<pre>標(biāo)簽中加class="pure-highlightjs" 即可。

Prism.js文件下載

[download-button ]官網(wǎng)[/download-button][download-button ]蘇醒特供款[/download-button]