Question

我创建了自定义图片插件，只插入外部图片。但是，如果我禁用默认图像插件，那么img标签不会出现在表单中。为什么？

这是我的插件：

CKEDITOR.plugins.add( 'img',
{
    init: function( editor )
    {
        editor.addCommand( 'insertImg',
            {
                exec : function( editor )
                {    
                    var imgurl=prompt("Insert url image");
                    editor.insertHtml('<img src="'+imgurl+'" />');
                }
            });
        editor.ui.addButton( 'img',
        {

            label: 'Insert img',
            command: 'insertImg',
            icon: this.path + 'images/aaa.png'
        } );
    }
} );

Answer 1

您需要将您的插件与ACF - CKEditor 4.1中引入的高级内容过滤器集成。

这是一个有用的指南 - Plugins integration with ACF。

基本上，您正在向编辑器介绍一项功能。此功能需要告诉编辑器它是如何在HTML中表示的，因此启用此功能时应该允许什么。

在最简单的情况下，当您有一个执行命令的按钮时，您只需要定义CKEDITOR.feature界面的两个属性：allowedContent和requiredContent。

E.g：

editor.addCommand( 'insertImg', {
    requiredContent: 'img[src]', // Minimal HTML which this feature requires to be enabled.
    allowedContent: 'img[!src,alt,width,height]', // Maximum HTML which this feature may create.
    exec: function( editor ) {    
        var imgurl=prompt("Insert url image");
        editor.insertHtml('<img src="'+imgurl+'" />');
    }
} );

现在，当此按钮添加到工具栏时，将自动启用功能并允许图像。

Answer 2

您在addButton配置中设置了错误的命令名称。你需要设置：

editor.addCommand( 'insertImg', {
         ...
     }
);

以及command

中editor.ui.addButton()配置的名称

<强> UPD：一些小提琴：http://jsfiddle.net/kreeg/2Jzpr/522/

如何允许img标签？

2 个答案: