wordpress主题开发-非插件实现主题网页代码高亮

对于喜欢wordpress主题开发的朋友来说，看了相关wordpress教程，平日总要写几段代码来玩玩。网页代码高亮插件真的是非常多。例如：Google Code Prettify，SyntaxHighlighter ，Highlight.js等等。

以上代码高亮插件都不错，偶然在wordpress主题开发的过程中发现Prism.js这个轻量级的JavaScript代码高亮很好耍！Prism.JS也大部分流行的编程语言，并且支持多种主题样式，只需要引用CSS文件和JS文件即可完成。

官网地址：http://prismjs.com/index.html

下载文件

Prism.js支持很多种语言和插件主题。把一些不必要支持的语言包下载下来，会加大库文件大小，拖累我们网站加载速度。所以Prism.js采用自定义下载。

可以看出Prism.js支持的配置项还是非常多的。我们勾选上我们需要的选项，点击最下方的下载css和js下载文件。

提示： 除了选择语言，在最下方的Plugins选项中，有一个Line Numbers还是非常值得下载的，可以在代码前显示行号。

添加代码

复制代码到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'); 

编辑文章

编辑文章时，使用文本模式，输入下面的代码：

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

（language-c中，可修改任意语言，但必须保留language-，如language-php）
如果你想每行代码前带序号，只需要在<pre>标签中加class="line-numbers" 即可。前提是下载Prism.js文件时勾选了Line Numbers选项,其他功能可以相对应的进行选择下载。

如何获得最好的网站定制服务？wordpress公园,争做中国最专业的web app开发商