WordPress非插件支持代码高亮（代码着色）

代码高亮（代码着色）就是指让代码中不同语句根据类别显示不同的颜色，从而增强可读性，而不是干巴巴一片黑色。我们可以通过 Hightlight 或 Prism 使网页支持代码高亮。
prism.js，是一个轻量级，可扩展的语法着色工具，可以让你的代码块中的代码颜色更丰富更好看（也就是“代码高亮”）。

第一步：下载配置文件

官网地址

https://prismjs.com/download.html

在 Prism 官网上自定义你的代码着色样式：着色主题、着色插编程语言范围、插件（高亮行、显示行号、高亮关键字、链接跳转、颜色块显示、命令行风格、复制按钮）等，然后下载相应的 css 文件和 js 文件，将其放置到你的服务器上。

第二步：引入这两个文件

<script src="<?php bloginfo('template_url'); ?>/.../prism.js"></script>
<link rel="stylesheet" href="<?php bloginfo('template_url'); ?>/.../prism.css" />

第三步：使用方法

写文章的时候只要切换到“文本”模式，并将代码包裹

<pre>
    <code class="language-markup">
        <!-- 代码 -->
    </code>
</pre>

第四步：Pre 标签内的代码不转义

修改主题下的“functions.php”文件，在末尾添加如下代码：

function art_esc_code ( $content ){
    $pattern = '/<code\s+?class=.*?>([\s\S]*?)<\/code>/i';
    preg_match_all( $pattern, $content, $matches, PREG_PATTERN_ORDER );
    foreach( $matches[1] as $string ){
        $replacement = esc_html( $string );
        $content = str_replace( $string, $replacement, $content );
    }
    return $content;
}
add_filter( 'the_content', 'art_esc_code', 1 );

除了 WordPress，Prism 还可以用在其它任何网站程序中，大概流程无非就是：引入 Prism.js 和 Prism.css → 配置好代码转义 → 用

<pre><code>

包裹代码即可实现代码高亮。