ueditor 编辑器增加css样式_ueditor编辑器实现语法高亮

ueditor编辑器实现语法高亮

本站前期采用的是dreamlu开源博客搭建，网站后台编辑器采用的是百度ueditor富文本编辑器。在我的迭代改进时，在编辑器上还采用了这一编辑器，不过一直以来发现后台虽然有语法高亮模块，但前台显示的页面显示的时候并没有实现这一个功能。所以趁着周末来找一下原因并将解决过程中的相关问题记录一下，以方便有同样需要的朋友。

前台没有能正常语法高亮的原因是没有引入语法高亮相关的脚本及样式。通过万能的GOOGLE，知道了解决的办法.解决办法就是在页面代码里添加相关的脚本及样式表,ueditor采用的是SyntaxHighlighter来实现，所以需要在页面中添加如下代码就可以解决这一问题:

SyntaxHighlighter.all();

添加如上代码后，配置好的代码片断就可以高亮显示了。不过这里面还存在个小问题，那就是如果代码行过长的话，会溢出当前的正文，产生错行的现象，对整体形象产生非常不好的影响，所以还得解决一下这个问题。我又在网上搜一下相关的解决方案，这个问题有人遇到并解决了(http://mo2g.com/view/60/)。解决办法就是改一下对应的CSS样式表。我就按照着文档修改一下，但没有达到预期的效果，后来干脆直接使用对方的相关脚本和样式表，替换了原来的脚本和样式表后，果然完美解决这个问题。特意记录一下，另外如果大家在使用ueditor的过程中也遇到了这个问题，也可以采用同样的办法看看是不是能解决问题。