WP安装之后,后台编辑器使用的是自带的 TinyMCE 编辑器,功能及其简单,排版功能不如人意。虽然可以添加代码高亮插件,但是对于程序员来说,要排版又要代码高亮的话,必须在可视化模式和源码模式不断切换,但是 TinyMCE 切换之后,会使代码高亮失去效果,造成排版混乱。
排版好的编辑器还有 CKeditor 等,但是,如何在其基础上,添加代码高亮插件 SyntaxHighlighter 的插入按钮呢?网上搜了,出了一大堆,我就不写了,我就说说原理吧。
CKeditor 的每一个按钮都是属于它的一个插件,于是 goolecode 上有人开发了 SyntaxHighlighter 的 code 插件,用于插入 SyntaxHighlighter 代码高亮的特定语法。
<pre class=”brush:php”>代码</pre>
它并不能使代码高亮,要时代码高亮,还需安装 wordrepss 的代码高亮插件,而且是要使用以上语法的代码高亮插件。
googlecode中 CKeditor 的 SyntaxHighlighter 插件已经很久没升级了,但是在 SyntaxHighlighter 系列的代码高亮插件升级后,出现小小的 BUG ,于是有人修改了这个 按钮插件,使其更好的支持新版的 SyntaxHighlighter 系列代码高亮插件。
理论说了这么多,大家应该明白他的运作原来了,总体的意思,我简单的阐述以下,其实就是为 wordpress 的 SyntaxHighlighter 系列代码高亮插件在 CKeditor 添加 按钮。
由于给CKeditor 插件添加 按钮比较繁琐,而且 goolgecode 上的 CKeditor 按钮插件有点小BUG,我就将解决了 BUG 的按钮插件集成到 CKeditor 提供给大家,一共两个,均是由 CKeditor for wordpress 1.01 版添加 代码插入按钮插件修改二来的,不同的是,一个带 CKfinder,一个不带 CKfinder,至于 CKfinder 是什么,我就不说了,
附图,需要下载的清往下看:
需要下载的,看清下面。
ckeditor-for-wordpress-with-ckfinder
ckeditor-for-wordpress-1.0.5-with-ckfinder.zip (2.03M)
ckeditor-for-wordpress-without-ckfinder
ckeditor-for-wordpress-1.0.5-without-ckfinder.zip (1008.76K)
注意,通过上面的理解,应该知道,这个编辑器插件,只有输入代码的功能,并没有代码高亮的功能,要实现代码高亮,需要支持上面语法的 wordpress 代码高亮插件。使用这个代码高亮语法的 wordpress 插件是:
Syntax Highlighter and Code Colorizer for WordPress
安装很简单,在wordpress插件中搜索安装即可,但是很奇怪,安装之后,名字变成了
Syntax Highlighter and Code Prettifier Plugin for WordPress
希望 使用 wordpress 的程序员,能够使用上好的编辑器与代码高亮插件。
顺带提一句,我也曾试过 CK and SyntaxHighlighter 的 wodpress 插件。这个插件只能运行在 WP3.0以下版本,不能运行包括 WP3.0 在内的高级 WP 版本。而且在插入代码的时候,会初小代码丢失的问题。
2011.2.19 更新下载地址,并使用最新版 ckeditor for wordpress 制作,也就是1.05那个版本,安装后不会提示有升级,以后的话,可能不会在升级了。这次是应留言发上来的。还有就是,以前那个地址其实可以下的,但是由于GFW的原因,你懂的。
晚上新增Dbank网盘。



额,好复杂~
复杂?那就简单告诉你,下载上面打包好的随便一个ckeditor-for-wordpress然后上传安装,再在后台安装一个Syntax Highlighter and Code Colorizer for WordPress代码高亮插件,就行了。
不错哦,我也换一个来试试。
只适合wordpress的哦。
下载连接失效了哦,麻烦更新一下
过两天,最近没时间弄,弄好了,会回复你的。
已经更新下载地址,并使用最新版本从新做了一遍,可能以后就不做了,还有,如果是想使用上面介绍的代码高亮,回头我会再发一篇文章,说那个插件的使用的
这个好像是新的版本?之前用过一个,不太好用就放弃了,呵
小小更新,我只是在原来插件版本上添加了一个按钮。不过已经找到一个完美的代码高亮插件,所以用回原本的编辑器了。
博主能不能说说是怎么把这个按钮加到ckeditor里的?我试了很长时间都不行。
等上班的时候再看看,现在在家,什么都不方便。
找不到很详细的文件了,不写教程了,简单和你说说
ckeditor.config.js
这个文件第42行添加了 ‘syntaxhighlight’
注册这个按钮是在第44和45行。根据45行的提示放插件所在位置。