CKEditor 4.2.2 - allowedContent = true is not work

Question

I guess I've read most of the SO questions and CKEditor documentation about this, but it does not work for me.

It should be plain and simple, in my CKEditor config.js, I have this :

CKEDITOR.editorConfig = function(config) {
    config.allowedContent = true;
};

But the html is still filtered and this piece of code is being stripped :

<p>
<a href="/site/public/press.pdf"><span class="icon-presseFile"></span></a>
<a href="/site/public/pics.zip"><span class="icon-pressePics"></span></a>
</p>

into this :

<p>&nbsp;</p>

The <span> elements are font icons.

Any help would be greatly appreciated.

EDIT It works if I add some text in the <span> elements (but I don't want tohave to do that)

Answer 1

This solution helped me solved my problem : CKEditor strips <i> Tag

For the span I wrote in the config.js :

// ALLOW <span></span>
config.protectedSource.push( /<span[\s\S]*?\>/g ); //allows beginning <span> tag
config.protectedSource.push( /<\/span[\s\S]*?\>/g ); //allows ending </span> tag

Answer 2

Be aware that it might be a rogue plugin causing config.allowedContent = true to be ignored. I just learned this at a cost of 12 hours of my life.

The offending plugin overrode config.allowedContent = true in the custom config file. So if you're banging your head against the wall cursing at CKEditor, try disabling/commenting out all of your plugins (config.extraPlugins). If the problem goes away, you know one of those plugins is the cause.

Answer 3

I found that I had to add it OUTSIDE of the main config function.

This worked:

CKEDITOR.editorConfig = function( config ) {
...
};
CKEDITOR.config.allowedContent = true;

But this didn't:

CKEDITOR.editorConfig = function( config ) {
    config.allowedContent = true;
    ...
};

Answer 4

I had the same problem using Firefox. To solve it I had to change the name of the config.js file to anything else like ckeConfig.js and declare the new name:

CKEDITOR.replace("textAreaId", {
    customConfig: 'yourPath/ckeditor/ckeConfig.js', 
});

And don't forget to link in Html too:

<script src="~/yourPath/ckeditor/ckeditor.js"></script>
<script src="~/yourPath/ckeditor/ckeConfig.js"></script>