3

我在所见即所得的编辑器ckeditor上遇到了一些麻烦。在试图摆脱任何基于 Flash 的媒体播放器时,我偶然发现了 MediaElement (http://mediaelementjs.com/),它被认为是播放音频和视频的好选择 ( http://drupal.org/node /1035630)。

有没有一种简单的方法可以将此播放器集成到媒体插件中?我想应该有一种方法可以将基于 Flash 的播放器换成媒体元素..?

想法?

4

1 回答 1

3

您可以基于 flash 插件创建自定义插件。

大写很重要,这里是风格指南:编码风格指南 http://docs.cksource.com/FCKeditor_3.x/Design_and_Architecture/Coding_Style

复制_source/plugins/flash目录并重命名,我们称之为mediaelement。

将重命名的目录放在这里/plugins/mediaelement

然后重命名/plugins/mediaelement/dialogs/flash.jsmediaelement.js.

将您的16px X 16px工具栏按钮图像添加到/plugins/mediaelement/images/目录中。
我知道.png文件工作,没有尝试过其他人。


配置:
在您的配置中加载新插件:

config.extraPlugins = 'mediaelement';

将按钮添加到工具栏配置设置'MediaElement'

config.toolbar_xxx

文件修改
您需要更改对“flash”插件名称和文件的引用。以下是加载插件和打开对话框窗口所需的最小更改:

插件/mediaelement/dialogs/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 的嵌入代码与 Media Element 的嵌入代码进行比较,以查看哪些部分相互对应,并相应地修改对话框文件。

于 2012-07-18T16:31:33.557 回答