KindEditor4.1.4代码高亮显示设置

在线编辑器KindEditor很强大，但是默认没有开启代码高亮功能。网上找到了一些方法。

1.后台还需要加载prettify.js和prettify.css

<script src="editor/plugins/code/prettify.js"></script>
<link rel="stylesheet" href="editor/plugins/code/prettify.css">

编辑器初始化设置后，在里面加cssPath(注意路径)和prettyPrint()

KindEditor.ready(function(K) {
			window.editor = K.create('#editor_id',{
				cssPath:'editor/plugins/code/prettify.css',
				resizeType:0,
				items:[
        'undo', 'redo', '|',
		'selectall','cut', 'copy', 'paste','plainpaste', 'wordpaste', '|', 
		'justifyleft', 'justifycenter', 'justifyright', 'justifyfull','|',
		'insertorderedlist', 'insertunorderedlist', 'indent', 'outdent', 'subscript',
        'superscript', '|',
		'clearhtml', 'quickformat', 'removeformat', '|', 'source','preview','fullscreen', '/',
        'formatblock', 'fontname', 'fontsize', '|',
		'forecolor', 'hilitecolor', 'bold','italic', 'underline', 'strikethrough', 'lineheight',  '|',
		'code','image','table', 'hr', 'emoticons', 'baidumap', 'pagebreak', 'anchor', 'link', 'unlink'
				]
			});
		prettyPrint();
	});

2.前端要显示，添加如下代码

<link type="text/css" rel="stylesheet" href="editor/plugins/code/prettify.css"/>
<script type="text/javascript" src="editor/plugins/code/prettify.js"></script>
<script>prettyPrint();</script>

代码显示默认不会换行，若要换行，需要在plugins/code下的prettify.css中添加以下内容

pre.prettyprint {
	width: 630px;//代码宽度
	margin: 1em auto;
	padding: 1em;
	white-space: pre-wrap;
}