基于 prismjs 的代码语法高亮插件 for Typecho，可显示语言类型、行号，有复制代码到剪切板功能。
github开源地址(插件下载地址)：https://github.com/Copterfly/CodeHighlighter-for-Typecho
备用地址：CodeHighlighter-for-Typecho-master.zip

起始

本插件是基于 prismjs 的 Typecho 代码语法高亮显示插件。(Typecho 1.1版可用，其它版本请自行尝试)
可显示语言类型、行号，有复制功能。(请勿与其它同类插件同时启用，以免互相影响)

使用方法

第 1 步：下载本插件，放在 usr/plugins/ 目录中；
第 2 步：文件夹名改为 CodeHighlighter；
第 3 步：登录管理后台，激活插件；
第 4 步：设置：选择主题风格，是否显示行号等。

代码写法
基于 prismjs 的代码语法高亮插件 for Typecho，可显示语言类型、行号，有复制代码到剪切板功能

高亮效果图

<!DOCTYPE html>
<html>
    <head>
        <mate charest="utf-8" />
        <meta name="keywords" content="Editor.md, Markdown, Editor" />
        <title>Hello world!</title>
        <style type="text/css">
            body{font-size:14px;color:#444;font-family: "Microsoft Yahei", Tahoma, "Hiragino Sans GB", Arial;background:#fff;}
            ul{list-style: none;}
            img{border:none;vertical-align: middle;}
        </style>
    </head>
    <body>
        <h1 class="text-xxl">Hello world!</h1>
        <p class="text-green">Plain text</p>
    </body>
</html>

重要说明

可设置项

1.选择高亮主题风格 (官方提供的 8 种风格切换)
coy.css
dark.css
default.css
funky.css
okaikia.css (默认选中，因为比较顺眼)
solarized-light.css
tomorrow-night.css
twilight.css

2.是否在代码左侧显示行号 (默认开启)

在插件中不方便实现的设置项

由于 prismjs 与 highlightjs 的插件扩展机制不同，所以本插件的有些扩展项是无法设置的。

本插件支持常见的一些语言高亮。您可以打开以下链接查看详情：
http://prismjs.com/download.html#themes=prism-okaidia&languages=markup+css+clike+javascript+apacheconf+c+aspnet+bash+cpp+csharp+coffeescript+markup-templating+git+java+less+markdown+nginx+php+sql+python+smarty&plugins=line-numbers+toolbar+show-language+copy-to-clipboard

如有需要，请勾选需要支持的语言定制您的 js 和 css 文件，下载好后，分别替换以下文件：
Typecho 插件目录\CodeHighlighter\static\prism.js
Typecho 插件目录\CodeHighlighter\static\styles\改为对应的风格名.css (如跟您博客样式有冲突，稍作修改此 css 即可)

建议

插件 Plugins 请至少勾选以下 4 项：

Line Numbers (在代码左侧显示行号)
Toolbar (代码块右上方工具条)
Show Language (显示代码是什么语言【依赖: Toolbar】)
Copy to Clipboard Button (复制代码功能【依赖: Toolbar】)

不使用插件也能添加高亮代码，并自动显示行号

一、prismjs官网下载js和css文件，原理同上。
二、将下载的js和css文件放在主题目录下
三、编辑header.php，在<head>这里中间</head>添加代码引入js和css代码

<link rel="stylesheet" href="<?php $this->options->themeUrl('prism.css'); ?>" />
<script src="<?php $this->options->themeUrl('prism.js'); ?>"></script>

四、以上就OK了，如果你需要自动添加行号，在footer.php中添加代码

<script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.min.js"></script>
<script type="text/javascript">
  $('pre').addClass("line-numbers");
</script>

注意：如果你已经开启并引入过jQuery那<script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.min.js"></script>就不需要重复引入了。