让FCKEditor与dp.syntaxhighlighter完美结合,JavaScript

FCKeditor毫无疑问已经是WEB编辑器的龙头老大，功能强，使用广，为广大程序员所喜欢。
dp.syntaxhighlighter是完全用javascript编写，用来实现语法高亮的工具。以其方便易用，功能强大，赢了广大开发的青睐。
很多人都很喜欢WORDPRESS的语法亮亮，可以以WORDPRESS的语法高亮插件是赢得如此之多程序员喜欢的重要理由。
如果我们能够把syntaxhighlighter开发成为FCKeditor的语法高亮显示插件，那么对于FCKeditor来说，无疑是如虎添翼。而对于syntaxhighlighter来说，更是多了一个展现自己的更大舞台。
事实上，国内早已经有人这么做了，比如JAVAEYE的论坛，就是把syntaxhighlighter做为FCKeditor的插件来实现语法高亮显示。其他好像也有人做了，不过除了JAVAEYE没有人真正展示过效果。
所谓插件，我的理解是应该完全融合在主程序中，除了在主程序内做必要的配置之外，不需要在主程序外的任何其他地方专门对插件做某些修改。而大概分析了一下javaeye的做法，并没有把syntaxhighlighter做为FCKeditor的完全独立插件来做，还需要依赖于手工在页面中单独添加syntaxhighlighter的CSS。
想把syntaxhighlighter做成FCKeditor的插件的想法由来已久。这周经过仔细研究，终于成功完成了一大步。第一时间推出了，让大家一起感觉FCKeditor与syntaxhighlighter双剑合壁的简单方便与巨大威力。
具体的开发需要熟悉开发FCKeditor插件，了解syntaxhighlighter的用法。在这里就不多说了，有兴趣的可以自己研究一下。
这里只简单的讲一下使用方法。
＊＊＊＊＊＊
第一种情况：
点击这里，

FCKeditor_with_syntaxhighlighter.rar结合了syntaxhighlighter的FCKeditor，并带有示例页面。
解压到适应目录后，修改sample.html页面里的sBasePath变量。

<script type="text/javascript">
//注意这里，根据实际环境修改
var sBasePath = "http://localhost/my_works/FCKeditor_with_syntaxhighlighter/FCKeditor/";
var oFCKeditor = new FCKeditor( 'FCKeditor1' ) ;
oFCKeditor.BasePath = sBasePath ;
// Set the custom configurations file path (in this way the original file is mantained).
oFCKeditor.Config['CustomConfigurationsPath'] = sBasePath + 'custom.config.js' ;
// Let's use a custom toolbar for this sample.
oFCKeditor.ToolbarSet = 'custom' ;
oFCKeditor.Value = '' ;
oFCKeditor.Create() ;
/script>

点击

图标，立即感受二者威力。
＊＊＊＊＊＊
第二种情况：
点击这里，

highlighter.rarsyntaxhighlighter插件。
解压以后，放置在你的FCK里的plugins目录，或者其他自定义的plugin目录。
1、修改你的config文件，在ToolbarSet里加上'HighLighter'。

// Set toolbar.
FCKConfig.ToolbarSets["custom"] = [
['HighLighter','Placeholder','DocProps','-','Save','NewPage','Preview','-','Templates'],
['Cut','Copy','Paste','PasteText','PasteWord','-','Print','SpellCheck'],
['Undo','Redo','-','Find','Replace','-','SelectAll','RemoveFormat'],
['Form','Checkbox','Radio','TextField','Textarea','Select','Button','ImageButton','HiddenField'],
'/',
['Bold','Italic','Underline','StrikeThrough','-','Subscript','Superscript'],
['OrderedList','UnorderedList','-','Outdent','Indent'],
['JustifyLeft','JustifyCenter','JustifyRight','JustifyFull'],
['Link','Unlink','Anchor'],
['Image','Flash','Table','Rule','Smiley','SpecialChar'],
'/',
['Style','FontFormat','FontName','FontSize'],
['TextColor','BGColor'],
['FitWindow']
] ;

2、根据你指定的plugin目录，注册plugin

// Change the default plugin path.
FCKConfig.PluginsPath = FCKConfig.BasePath.substr(0, FCKConfig.BasePath.length - 7) + 'editor/customPlugins' ;
//注意这里，就是调用syntaxhighlighter插件的地方
FCKConfig.Plugins.Add( 'highlighter' , 'en') ;

(FCKeditor版本：2.3.2，syntaxhighlighter版本：1.5.1)
FCKEditor的插件开发，最好的参考地方还是官方wiki：

http://wiki.fckeditor.net/
dp.syntaxhighlighter的官方下载在这里：

http://code.google.com/p/syntaxhighlighter/