媒體元素集成到Ckeditor

我遇到了一些麻煩的wysiwig編輯器ckeditor。在試圖擺脫任何基於閃存的媒體播放器時，我偶然發現MediaElement（http://mediaelementjs.com/），MediaElement被認爲是播放音頻和視頻的不錯選擇（http://drupal.org/node/1035630）。媒體元素集成到Ckeditor

有沒有簡單的方法將此播放器整合到媒體插件中？我想應該有一種方法來換出媒體元素的閃光燈播放器..？

想法？

來源

2012-07-18 user1535191

您可以基於Flash插件創建自定義插件。

資本事宜，這裏的風格指南：編碼風格指南 http://docs.cksource.com/FCKeditor_3.x/Design_and_Architecture/Coding_Style

複製_source/plugins/flash目錄並將其重命名，讓我們把它的MediaElement。

將重命名的目錄放在這裏/plugins/mediaelement。

然後將/plugins/mediaelement/dialogs/flash.js重命名爲mediaelement.js。

將您的16px X 16px工具欄按鈕圖像添加到/plugins/mediaelement/images/目錄。
我知道.png文件的工作，還沒有嘗試過別人。

配置：
加載在你的配置新的插件：

config.extraPlugins = 'mediaelement';

添加按鈕，工具欄配置設置'MediaElement'

config.toolbar_xxx

文件修改
您需要更改對「flash」插件名稱和文件的引用。以下是得到加載插件所需的最少的變化和對話窗口打開：

插件/的MediaElement /對話框/ mediaelement.js（174）

CKEDITOR.dialog.add('mediaelement', function(editor)

插件/的MediaElement/plugin.js（ 22 - 33）

CKEDITOR.plugins.add('mediaelement', 
    { 
    init : function(editor) 
    { 
     editor.addCommand('mediaelement', new CKEDITOR.dialogCommand('mediaelement')); 
     editor.ui.addButton('MediaElement', 
     { 
      label : 'Media Element', 
      command : 'mediaelement', 
      icon: this.path + 'images/mediaelement_btn.png' 
     }); 
     CKEDITOR.dialog.add('mediaelement', this.path + 'dialogs/mediaelement.js');

這裏還有上創建插件的一些教程：
http://docs.cksource.com/CKEditor_3.x/Tutorials

他們會給你一個結構和所需元素的理解。我通過閱讀教程來了解這一點，同時使用現有插件的副本，但花了一些時間，但大部分需要的是在那裏。

本教程包含有關創建對話框窗口和使用的參數的信息，它們將幫助您瞭解plugins/mediaelement/dialogs/mediaelement.js文件中發生了什麼。

您可以修改對話框文件以包含MediaElement實現使用的字段。我建議您將Flash的嵌入代碼與用於媒體元素的嵌入代碼進行比較，以查看哪些部分相互對應，並相應地修改對話框文件。

來源

2012-07-18 16:31:33 codewaggle

感謝您的回覆！ – user1535191 2012-07-18 18:53:19

所以我所要做的就是將之前所說的「flash」引用改爲plugin.js文件中的mediaelement？我在哪裏可以在對話框中實際引用媒體元素播放器文件？ – user1535191 2012-07-18 19:01:32

您需要查看文件中每個單詞「flash」出現的上下文，以決定如何替換它。對話文件應該從flash.js重命名爲mediaelement.js。它會創建對話窗口，其中包含您將用於各種設置的字段。您需要對其進行修改以使用媒體元素特定的設置。如果您查看教程以瞭解對您的情況有什麼重要性，這將會很有幫助。我會看看這些文件，並在我的答案中添加一些註釋。 – codewaggle 2012-07-18 20:09:55

媒體元素集成到Ckeditor

回答

相關問題