第一步：將下面的代碼復(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é)束后，就可以實(shí)現(xiàn)代碼高亮了。
對，就這么簡單。

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

<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]

教程

1.檢測文章中是否插入了pre標(biāo)簽。若插入了代碼，就在網(wǎng)頁的footer部分插入相應(yīng)的prettify.js和prettify.css。把以下代碼放到主題文件的functions.php文件中。

//正則匹配pre插入相應(yīng)的prettify.js和css by suxing.me
add_filter('wp_footer','add_prettify');
function add_prettify(){
//定義全局post
global $post;
//正則匹配pre開始標(biāo)簽
preg_match_all('|(<pre)|i', $post->post_content, $matches);
if(is_single() && !empty($matches[0])) {
//如果存在pre標(biāo)簽時(shí)，就把以下代碼加入到footer之中
?>
<link rel="stylesheet" id="is-load-css" href="<?php bloginfo('template_url'); ?>/js/prettify.css"/>
<script type="text/javascript" src="<?php bloginfo('template_url'); ?>/js/prettify.js"></script>
<script type="text/javascript">
jQuery('document').ready(function(){
jQuery('.post pre').addClass('prettyprint linenums')
.wrap('<div class="precode clearfix"></div>');
window.prettyPrint && prettyPrint();
});
</script>
<?php
}
}

2.把prettify.js和prettify.css都加載主題目錄的JS文件夾里面。

3.最后，在編輯文章的時(shí)候，輸入<pre class="prettyPrint">代碼放這里</pre>就可以使用標(biāo)簽實(shí)行代碼高亮了。

下載

[download-button ]百度云下載[/download-button][download-button ]官方下載[/download-button]