CKEditor to disallow style attributes

[Lars282]

I have tried adding disallowedContent: *[style] to the Custom Config Options with ACF on, but it throws a JSON validation error.

Where am I wrong?

[titanium]

I have tried adding disallowedContent: *[style]

It's not possible to filter style as an attribute in CKEditor this way. CKEditor works with this pattern: [attributes]{styles}(classes). Valid attributes are align or onclick for example, but style is handled with the second part of the pattern, in curly brackets. What you can do for example: [*]{width} will strip style="width:10px" from all elements. You can enhance this functionality with own JS functions. Read more about it in CKEditor docs

[Lars282]

Maybe I just don't get it ... but following this logic, how do I strip all style attributes from all tags? Would *[*]{*} work?

Edit: seems to work - or do you see any issues with this?

[LostKobrakai]

The syntax allows things in ckeditor. Your example would allow all possible combinations of tags. *{} could work, because it's stating no allowed style values for each element, but because of the empty brackets it could be that it's ignored and therefore any defaults are used.

[Lars282]

disallowedContent: *[*]{*} is what I would use. Does that make sense?

[LostKobrakai]

That would disallow all attributes (id/class/src/href) as well. Disallowing *{*} should be enough because it's preventing everything besides an empty style tag.

[doolak]

Hi there, I would like to remove the <p></p> - tags from a CKEditor field - tried now 

disallowedContent: p

but this does not work. 

Any idea how to get that work?

[doolak]

... or is there maybe another way to strip unwanted tags in a different way? (without having to strip the tags in each template where that field is used?)

[Christophe]

@doolak

Hello,

From

Example: Disallow tags

// Disallow <a> element. The Link button will be removed from the toolbar.
config.disallowedContent = 'a';

it seems that it's possible. Source: http://docs.ckeditor.com/#!/guide/dev_acf

Go to your specific field > Input > Custom Config Options... and try with 

config.disallowedContent = 'p';

This is for (1).

For Custom Config Options, I've just tried with

disallowedContent: p

(see Example: uiColor: #438ef0) and I don't have the error message. But for the moment I don't see any change.

(I don't know where it is/should be saved...)

I have the error message if, for example, I write

disallowedContent: 'p'

I'm going to try this⁽¹⁾:

If preferred, these settings can also be set in one of these files:
/site/modules/InputfieldCKEditor/config.js - for all CKEditor fields
/site/modules/InputfieldCKEditor/config-sidebar.js - only for this CKEditor field

I have just tried with config-sidebar.js. It doesn't seem to work either.

It must be "normal", the p tag is an essential block element for CKEditor.

We can replace it with a div element, but inside a h1 element it is not a solution.

Perhaps creating 2 text fields would be... (with the span element(s) or not, for example). And using an if statement (but not necessarily).

[doolak]

I already tried that, but it gives an error ("Custom Config Options failed JSON validation.").

[doolak]

The aim for me is to give the admin the option to enter a heading which can contain two rows - when I use a textarea field he has to use <br /> - when I use CKEditor the heading will be wrapped in <p></p>. I guess one could use the sanitizer function and of course simple PHP, but I would have to place that in each template where a heading is used... So it would be great if I could strip the tags through the CKEditor somehow...