如何使用CKeditor允许所有html标签和属性？

Question

我正在尝试允许所有的html标签

<div> <p> <span> <i> /* etc */

和html属性如下(class,id),例如:

<div id="foo" class="bar" style="z-index:1;">SOME COOL CONTENT HERE</div>

在ckeditor.

我在docs.ckeditor.com找到了类似的东西

config.allowedContent = {
    $1: {
        // Use the ability to specify elements as an object.
        elements: CKEDITOR.dtd,
        attributes: true,
        styles: true,
        classes: true
    }
};
config.disallowedContent = 'script; *[on*]';

并将其添加到config.jsckeditor的根文件夹中.但没有改变.当我试图在ckeditor的源代码块上添加一些html标签时,它正在删除所有的html内容.

我错过了什么？提前致谢.

版本:## CKEditor 4.4.7

---

编辑和更新:

在@Eelke和@Necreaux回答之后,我allowedContent = true在config.js中添加了.现在基本的html元素如此<div> <span> <h3>完美.但是ckeditor仍然会<i>标记标签.

完全配置JS

    CKEDITOR.editorConfig = function( config ) { 
    config.allowedContent = true;
    config.removeFormatAttributes = '';
    // Define changes to default configuration here.
    // For complete reference see:
    // http://docs.ckeditor.com/#!/api/CKEDITOR.config

    // The toolbar groups arrangement, optimized for two toolbar rows.
    config.toolbarGroups = [
        { name: 'clipboard',   groups: [ 'clipboard', 'undo' ] },
        { name: 'editing',     groups: [ 'find', 'selection', 'spellchecker' ] },
        { name: 'links' },
        { name: 'insert' },
        { name: 'forms' },
        { name: 'tools' },
        { name: 'document',    groups: [ 'mode', 'document', 'doctools' ] },
        { name: 'others' },
        '/',
        { name: 'basicstyles', groups: [ 'basicstyles', 'cleanup' ] },
        { name: 'paragraph',   groups: [ 'list', 'indent', 'blocks', 'align', 'bidi' ] },
        { name: 'styles' },
        { name: 'colors' },
        { name: 'about' }
    ];

    // Remove some buttons provided by the standard plugins, which are
    // not needed in the Standard(s) toolbar.
    config.removeButtons = 'Underline,Subscript,Superscript';

    // Set the most common block elements.
    config.format_tags = 'p;h1;h2;h3;pre;';

    // Simplify the dialog windows.
    config.removeDialogTabs = 'image:advanced;link:advanced';
};

Answer 1

如果一切都被允许,你可以使用 allowedContent = true

Answer 2

第一件事是为什么删除一些元素,属性,样式和类而不管它们的内容如何.这是由高级内容过滤器引起的.有关如何更改其设置的更多详细信息,请参阅此问题: CKEditor会自动从div中删除类

另一件事是为什么无论是否允许空内联元素都会被删除.这个问题也已经被问到了 - 请参阅CKEditor条<i>标签 - 注意那里有更好的答案.

Answer 3

你试过以下吗？

config.allowedContent = true;
config.removeFormatAttributes = '';

Answer 4

你试过这个吗？

<script>
        CKEDITOR.replace( 'text-area-id' );
        CKEDITOR.config.allowedContent = true;
</script>