如果我们在使用常规的CMS程序希望代码高亮可以选择内置的高亮代码插件实现。但是有些CMS程序或者我们自建的主题中没有自带高亮插件的,我们或者希望高亮效果不要搞这么复杂,可以使用来自谷歌的Pretiffy.js实现内容的高亮效果。
第一、Pretiffy.js介绍
prettify.js 是Google的一款代码高亮插件,由js代码和css代码构成,用来高亮显示HTML页面中的源代码。支持C, Java,Python, Bash, HTML, XML, Javascript, Makefiles,Ruby, PHP, Awk, Perl, Basic, Clojure, CSS, Dart, Erlang, Go, Haskell, Lisp, Scheme, LLVM, Lua, Matlab, Pascal, R, Scala, SQL, LaTeX等语言。
文件地址:https://github.com/googlearchive/code-prettify
第二、如何安装
安装方法很简单,我们直接引用到当前站点,任何CMS的头部即可。
<link href= "prettify.css" type= "text/css" rel= "stylesheet" />
<script type= "text/javascript" src= "prettify.js" ></script>
这里我们引用到页面。
然后在html 的body标签中添加一个onload事件 οnlοad="prettyPrint()",如果你加载了JQuery,则可以添加以下代码。
$(document).ready(function(){
prettyPrint();
})
我们使用的时候,直接用pre闭合HTML引用即可。
文件下载地址: