FCKeditor 外掛程式開發 樣本(詳細版本)

來源:互聯網
上載者:User

(FCKeditor.地址是:http://www.fckeditor.net/.我下載的版本是:2.6.3。)
What ?
FCKeditor一直是web上編輯器的比較好的一個選擇,他是開源的,而且效果不錯。FCKeditor的外掛程式是對FCKeditor的擴充功能。
Why?
儘管一般條件下FCKeditor能適應使用,但你可能對FCKeditor僅有的功能不滿意,好.FCKeditor提供了外掛程式開放功能,只要你能想到,你就做吧。
How?
我就一個簡單的"Hello"為例來介紹FCKeditor外掛程式的開發(申明:俺也是菜鳥,有啥不對的地方,請指出來,大家進步啦。)
首先,進入FCKeditor編輯器目錄下的editor檔案下的plugins目錄下。這個目錄是放Fckeditor外掛程式的。So,建立一個檔案夾,命名為'hello'。
第二步,進入'hello'檔案夾。建立一個"fckplugin.js"的檔案。這是fckeditor外掛程式的所必須的,主要是外掛程式註冊等等。
再建立語言檔案。在'hello'檔案夾下建立一個'lang'的檔案夾。在'lang'檔案夾下建立語言檔案,Fckeditor外掛程式的語言檔案命名方式是:國家或地區.js。如中國是zh.js.簡體中文是zh-cn.js.英文是en.js等等。我們建立兩個"en.js"和"zh-cn.js"。
然後編輯語言檔案。我們編輯"en.js"。寫入以下內容:FCKLang.Hello="Hello";(注意包含";",js的代碼嘛),在"zh-cn.js"中寫入:FCKLang.Hello="你好";
FCKeditor外掛程式語言的命名方式為:FCKLang.變數名="語言定義"
OK,語言問題定義完成了,然後是外掛程式定義。
開啟第二步的"fckplugin.js"。 複製代碼 代碼如下://註冊
FCKCommands.RegisterCommand('hello',new FCKDialogCommand('hello',FCKLang.HelloB,FCKPlugins.Items['hello'].Path+"hello.html",200,200));
//定義工具列
var NHello=new FCKToolbarButton('hello',FCKLang.Hello);
NHello.IconPath=FCKPlugins.Items['hello'].Path+'hello.GIF';
//註冊
FCKToolbarItems.RegisterItem('hello',NHello);

OK,不懂?詳細說明:

外掛程式機制:註冊命令-定義工具列-註冊到工具列

註冊命令::FCKCommands.RegisterCommand(命令名稱,對話方塊命令)

對話方塊命令:FCKDialogCommand(命令名稱,對話方塊標題,URl,寬度,高度)

這樣註冊命令就完成,然後定義一個工具列

FCKToolbarButton(命令名稱,按鈕標題)

你最好添加一個表徵圖:IconPath=表徵圖地址

現在命令也註冊完成,工具列也定義好了,然後是添加:

FCKToolbarItems.RegisterItem(命令名稱,工具列);

注意:”Hello.html”就是你要顯示html中應該包含如下語句.

複製代碼 代碼如下:<script language="javascript">
var dialog = window.parent ;
var oEditor = dialog.InnerDialogLoaded() ;
var FCKLang = oEditor.FCKLang ;
</script>

OK.外掛程式製作完畢了,怎麼顯示呢?

在Fckeditor的目錄下找到 “fckconfig.js”,這是fckeditor的設定檔案。找到

” FCKConfig.PluginsPath = FCKConfig.BasePath + 'plugins/' ;”

添加:”FCKConfig.Plugins.Add(‘hello','zh-cn,en');

解釋:FCKConfig.Plugins.Add(外掛程式名,'語言檔案');其中語言檔案是可選的,如果沒有則自動化佈建。

然後在 “FCKConfig.ToolbarSets["Default"]=..”中的”[]”中隨便添加'hello' (注意包含引號)

OK…!完成

好,我們來重新確認一下FCKEditor外掛程式開發的過程:

建立” fckplugin.js”-建立外掛程式(語言檔案等)-添加外掛程式。

建立外掛程式必要步驟:插註冊命令-定義工具列-註冊到工具列

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.