CKEditor官网插件insertpre+语法高亮插件google-code-prettify可以很好地解决你的问题。
一 下载地址
CKEditor4下载地址:http://ckeditor.com/download
insertpre plugin下载地址:http://ckeditor.com/addon/insertpre
google-code-prettify下载地址:http://code.google.com/p/google-code-prettify/downloads/list
二 insertpre插件安装方法
解压insertpre下载文件,将解压后的文件夹放到CKEditor的plugins下。
配置config.js,加入下面代码就可以使用insertpre功能了。
config.extraPlugins = 'insertpre';
//config.toolbar中加入"InsertPre"按钮。
三 google-code-prettify语法高亮插件安装
解压下载文件,页面<head></head>间加入下面代码:
<link href="prettify.css" type="text/css" rel="stylesheet" />
<script type="text/javascript" src="prettify.js"></script>
<!--下面代码需要jquery.js支持-->
<script type="text/javascript">
$(document).ready(function(){
prettyPrint();
})
</script>
页面中<pre class="pettyprint"></pre>间的代码会自动语法高亮显示,下面是一个例子,里面的代码在pre标签间。
int x = foo();
/* This is a comment <span class="nocode">This is not code</span> Continuation of comment */
int y = bar();