CKeditor ですべての HTML タグと属性を許可するにはどうすればよいでしょうか? 質問する

CKeditor ですべての HTML タグと属性を許可するにはどうすればよいでしょうか? 質問する

すべての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 = trueconfig.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';
};

ベストアンサー1

すべてが許可されている場合は、allowedContent = true

おすすめ記事