Can't get CK Editor to allow an id

[schwarzdesign]

I need to allow the id-attribute for the <a>-Element, but I can't seem to get it to work.

I have tried setting the extraAllowedContent in the backend:

a[!href,id];

I have also tried using the line without the semicolon, no effect either.

I have tried setting the extraAllowedContent in the /site/modules/InputfieldCKEditor/config.js file instead as well:

CKEDITOR.editorConfig = function( config ) {
    // Define changes to default configuration here. For example:
    // config.uiColor = '#AADC6E';
    config.format_tags = 'p;h3;h4';
    config.extraAllowedContent = 'a[!href,id];';
};

But that didn't work either. I have verified that the javascript-settings on the edit page include that line:

    "InputfieldCKEditor_body_block_text": {
        "baseHref": "/",
        "contentsCss": "/wire/modules/Inputfield/InputfieldCKEditor/contents.css",
        "extraAllowedContent": "a[!href,id];",
        "extraPlugins": "pwlink,sourcedialog",
        "removePlugins": "image,magicline",
        "toolbar": [
            [
                "Format",
                "Styles",
                "-",
                "Bold",
                "Italic"
            ],
            [
                "NumberedList",
                "BulletedList",
                "Blockquote"
            ],
            [
                "JustifyLeft",
                "JustifyCenter",
                "JustifyRight"
            ],
            [
                "PWLink",
                "Unlink",
                "-",
                "HorizontalRule"
            ],
            [
                "Sourcedialog"
            ]
        ],
        "format_tags": "p;h3;h4",
        "language": "en",
        "entities": false,
        "uploadUrl": "",
        "pwUploadField": "",
        "pwAssetPageID": 1167,
        "height": "20em",
        "stylesSet": "engfer-styles:/site/modules/InputfieldCKEditor/mystyles.js?nc=1529934076",
        "customConfig": "/site/modules/InputfieldCKEditor/config.js?nc=1530805498"
    }

But every time I save, the id i add to a link in the source panel disappears. No idea how to debug this or what else I can try. Here are the rest of my settings for that field:

• Editor Mode is Inline (I tried switching to regular mode, doesn't work either).
• Use ACF is On
• Use HTML Purifier is On

Any help is very much appreciated.

[dragan]

I don't know, but it could be this issue: https://github.com/processwire/processwire-issues/issues/627

[Robin S]

Not sure sorry, but it's working for me.

[schwarzdesign]

@dragan I'm not sure it's related, as the Github issue mentions the allowedExtraContent settings string to be missing from the source code. In my case it appears there correctly, only the id-attributes are still being filtered.

@Robin S Is the id still there after you have saved the page? For me, it only disappears after I've saved the page. Come to think of it, doesn't CK Editor apply filtering after you close the source editor? In that case, maybe it's not an issue with CK Editor at all, but some other filtering applied by Processwire .. the id only disappears after I save the page.

[Soma]

Works just fine. What is your setup? Where is this field etc?

[schwarzdesign]

@Soma It's a multilanguage textarea field; the field is one field in a Repeater Matrix type. There are multiple Repeater Matrix items of that type on the page, so there are multiple instances of the field on the same page (this is why it's running in inline mode).

[Soma]

Can't reproduce it.

[wbertl]

I have exact the same problem.

My field config is

• Textarea (Mult-language, default body field) 
• CKEditor
• ACF and HTML Purifier is on
• Custom Config Options: 

  allowedContent: "p{text-align};h2[id];h3[id];a[href];ul;ol;li;strong;i;table;thead;tbody;tr;th[scope];td"

   

After I disabled the HTML Purifier option, the ID in the <a> tag isn't filtered anymore. But that wouldn't be an option for me. The extraAllowedContent option also doesn't work. :(

Are there any other workarounds?

[wbertl]

I found the root cause.

I disabled in my CKEditor the anchor plugin. If you take a look into the InputfieldCKEditor.module file you can see there is a check if the anchor plugin is disabled the HTML Purifier option "Attr.EnableID" is also disabled. 

self::$purifier->set('Attr.EnableID', stripos($this->toolbar, 'anchor') !== false); // for anchor plugin use of id and name attributes

Is there a possibility to override that configuration, or must it be changed directly in the InputfieldCKEditor.module file?