其实百度编辑器集成了代码语言的语法高亮显示功能,而且还很漂亮.在后台发布代码语言预览很正常,到前端为什么就没有了呢?其实是我们前端没有引用语法高亮的文件.下面小编来教大家如何引入.

百度提供给我们的语法高亮文件路径如下:

ueditor/third-party/SyntaxHighlighter

该路径下面分别有一个JS文件一个CSS文件,分别是:

shCore.js
shCoreDefault.css

我们只需要在前端要显示的地方引入他就可以了.当然实际引入路径需要你自己的实际情况.小编举个例子:

<link rel="stylesheet" type="text/css" href="你的路径/ueditor/third-party/SyntaxHighlighter/shCoreDefault.css">
<script src="你的路径/ueditor/third-party/SyntaxHighlighter/shCore.js"></script>

最后在加上执行的js函数如下:

SyntaxHighlighter.highlight();

OK,大功告成.前端可以正常显示代码语言的语法高亮功能了.

当然还有个问题,就是百度编辑给我们提供的CSS没有自动换行的功能,当我们页面不够大,他会无限延长不换行,这点很不友好,想解决的可以在本站查找相关的解决方案.