FCKeditor 編輯器插入代碼功能實現(xiàn)步驟

更新時間：2009年11月24日 02:07:52 作者：

4步輕松打造可以應用于任何FCK編輯器的CMS及其他程序,一個Fckeditor編輯器的插件，it560獨家首發(fā)教程,無需增加字段，不修改代碼，完全綠色環(huán)保。

功能強大得不得了，可以插入的語言包括：C/C++，XML/HTML，JavaScript，CSS，C#，Java，PHP，Python，Ruby，SQL，ASP/Visual Basic，可選擇在前臺顯示語言名稱、顯示行號、是否允許折疊等功能，而且還有語法著色功能，比你想像的還要完美。而且可分為以文本域顯示代碼和有運行按鈕的可執(zhí)行方式顯示。特向大家分享！
安裝方法如下：

1.下載壓縮包后，將文件夾insertcode拷貝到fckeditor\editor\plugins\目錄下，然后修改fckeditor/fckconfig.js此文件，在此文件中FCKConfig.PluginsPath = FCKConfig.BasePath + 'plugins/' ;下面加入以下代碼：
FCKConfig.Plugins.Add('insertcode');

2.打開fckeditor\editor\lang文件夾里的zh-cn.js，在DlgDivInlineStyle : "CSS 樣式",（注意這句后面一定要加一個逗號“,”）下面加入以下代碼
//Plugins
InsertCodeBtn : "插入代碼"

3.為了可以使用插入代碼功能，需要在相應的頁面加入CSS代碼(insertcode.css)，和下面的Js代碼。
========================================================
比如在文章模板頁鏈接Css文件：
<link rel="stylesheet" type="text/css" href="/fckeditor/insertCode.css">
或者直接把css代碼拷貝到模板的css文件中。
并在文章模板頁加入以下的js代碼。

復制代碼代碼如下:

 
<script> 
//以下是實現(xiàn)復制的代碼，請自己添加 
//javascript 
function $(id) 
{ 
return document.getElementById(id); 
} 
//復制文本 
function copyIdText(id) 
{ 
copy( $(id).innerText,$(id) ); 
} 
function copyIdHtml(id) 
{ 
copy( $(id).innerHTML,$(id) ); 
} 
function copy(txt,obj) 
{ 
if(window.clipboardData) 
{ 
window.clipboardData.clearData(); 
window.clipboardData.setData("Text", txt); 
alert("復制成功！") 
if(obj.style.display != 'none'){ 
var rng = document.body.createTextRange(); 
rng.moveToElementText(obj); 
rng.scrollIntoView(); 
rng.select(); 
rng.collapse(false); 
} 
} 
else 
alert("請選中文本，使用 Ctrl+C 復制!"); 
} 
</script> 

4.修改fckeditor/fckconfig.js文件，在編輯器控制面板中加入按鈕，在調用工具欄參數的Media后面加入insertcode（注意正確加上標點符號，否則會報錯）。如下所示：
FCKConfig.ToolbarSets[ "standard"] = [
['Source','Paste','PasteText','PasteWord','-','Undo','Redo','-','Bold','Italic','Underline','StrikeThrough','TextColor','Table','-','JustifyLeft','JustifyCenter','JustifyRight','OrderedList','UnorderedList','-','Image','Attach','Flash','Media','InsertCode'],完成以上操作后，此時啟動fckeditor編輯器應該在編輯器的**上多了一個圖標，點擊此圖標即可添加你的代碼了。如果報錯，提示找不到工具項，那是FCKEDITOR的緩存沒清除，退出后臺或更新緩存，刷新一下，重新進入就可以看到代碼插入圖標了。

不知道怎么上傳附件到這里 - -#,我發(fā)個下載地址吧 :-) ,注冊個號，頂2貼就行!

文件打包下載

您可能感興趣的文章: