利用SyntaxHighlighter插件高亮代码

SyntaxHighlighter官网地址：http://alexgorbatchev.com/SyntaxHighlighter/

上传插件文件到博客园中

      下载的插件文件解压缩后有挺多文件，不过要用到的也不多。其中必须上传的文件有shCore.css和shCore.js，还有上传的是想要的主题css文件，比如我用的主题是shCoreEmacs.css，最后上传的要支持语言的js文件，比如我的代码是js代码，我就要上传js文件：shBrushJScript.js，如图1；另外一些常见的js对应的语言如图2所示。

图1 上传文件到博客园

图2 语言参数表

在设置中加入html代码到首部中：

     把上传的文件引入到html首部中，路径点击你上传文件出现的url就可以了。最后还要加入一句js代码，表示用插件来渲染语句，如图3

图3 插入链接到首部

编写代码到固定位置：

   编写代码的固定格式为：

　<pre class="brush: xxx">

　　//你的代码

   <pre>  

   其中xxx用图2的brush aliase替换就行了。

编写js 代码实例：

　　比如：

　　<pre class="brush: js">

　　　　function(){

　　　　　　return 'hello';

　　　　}

  　<pre>

　　高亮代码结果如下：

function(){
   return 'hello';　
}

注意：在添加html，xml等代码的时候，符号<要替换成&lt;否则渲染失败。还有就是渲染有html和js代码共存的，要在pre利用添加一个属性html-script:true，这样才能够正确识别。pre的更多参数点击这里>>

转载于:https://www.cnblogs.com/wozien/p/6599151.html