CKeditor4.4.X版本添加程序代码高亮插件图文详解

[JAVA]_图文详解CKeditor4.4.X版本添加程序代码高亮插件codesnippet

1.去CKeditor官网下载4.4.X及以上版本

官网直通车：点击

2.下载CKeditor插件codesnippet 

直通车：点击

3.打开CKeditor的配置文件config.js

加入配置

加入后

编辑器上就多了个图标

点击即可插入程序代码。

展示页面需要导入CSS.JS以及初始化，具体如下

<!-- code高亮模块CSS -->
<link rel="stylesheet" type="text/css"
	href="ckeditor/plugins/codesnippet/lib/highlight/styles/monokai_sublime.css" />
<!-- code高亮模块JS -->
<script type="text/javascript"
	src="ckeditor/plugins/codesnippet/lib/highlight/highlight.pack.js"></script>


<!--注意此初始化方法需要导入jQuery支持-->
<script>
$(function() {
	// 初始化代码高亮
	hljs.initHighlightingOnLoad();
});
</script>

现在就可以在该页面显示高亮代码了：

java编程 ckeditor教程 html教程 jQuery教程

https://www.leftso.com/article/38.html