Prevent WYSIWYG+CKEditor from stripping html classes I'm using WYSIWYG editor with CKEditor. I'm finding that when adding custom classes to my elements from the "source" view, CKEditor strips those classes when switching out of the source view.

When googling for a solution to this, I found the CKEditor module page which describes how to fix this when using CKEditor alone. (Basically, we need to set up a JS config config.allowedContent = true in its Advanced Content Filter settings).

However, when using CKEditor via WYSIWYG, these settings are not exposed in the admin interface. How do you achieve the same when using CKEditor via WYSIWYG?

PS: I cannot use CKEditor alone because it does not integrate with the media plugin.
I found a solution.

This turns off the filtering, it's working, but not a good idea...

config.allowedContent = true;


To play with a content string works fine for id, etc, but not for the class and style attributes, because you have () and {} for class and style filtering.

So my bet is for allowing any class in the editor is:

config.extraAllowedContent = '*(*)';


This allows any class and any inline style.

config.extraAllowedContent = '*(*);*{*}';


To allow only class="asdf1" and  class="asdf2" for any tag:

config.extraAllowedContent = '*(asdf1,asdf2)';


(so you have to specify the classnames)

To allow only class="asdf" only for p tag:

config.extraAllowedContent = 'p(asdf)';


To allow id attribute for any tag:

config.extraAllowedContent = '*[id]';


etc etc

To allow style tag (&lt;style type="text/css"&gt;...&lt;/style&gt;):

config.extraAllowedContent = 'style';


To be a bit more complex:

config.extraAllowedContent = 'span;ul;li;table;td;style;*[id];*(*);*{*}';


Hope it's a better solution...