4

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)

Pierre
  • 4,976
  • 12
  • 54
  • 76
  • 3
    The issue is propably not with ACF. That's what it does, empty `span`, `i`, `b` and `a` are all removed. See http://stackoverflow.com/questions/18261198 for solution or use something that is not a span. Or add  . Or wait for the new widgets feature, which I think might be very good for you. – Joel Peltonen Nov 14 '13 at 07:09
  • 1
    possible duplicate of [ckeditor removing empty span automatically](http://stackoverflow.com/questions/18261198/ckeditor-removing-empty-span-automatically) – Joel Peltonen Nov 14 '13 at 07:10

6 Answers6

16

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;
    ...
};
Will Henderson
  • 504
  • 1
  • 6
  • 15
  • Thanks for the comment. In fact, my problem was elsewhere, but it's good to know anyway! – Pierre Nov 22 '13 at 13:39
  • I have the same problem but this is not working for me. Did you figure out any other solutions to this ? – BenW Mar 21 '16 at 04:10
7

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.

valME.io
  • 109
  • 1
  • 3
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
Community
  • 1
  • 1
Pierre
  • 4,976
  • 12
  • 54
  • 76
0

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>
bets
  • 771
  • 8
  • 12
0

Try this:
CKEDITOR.replace('instanceName', { extraAllowedContent: 'a span' });

You can put whatever tags in that extraAllowedContent string that you do not want it to alter.

KennethDale1
  • 103
  • 2
  • 3
  • What if you don't want to alter ANYTHING and leave

    and
    and and anything else alone?

    – Scott M. Stolz Jul 23 '20 at 21:08
  • 1
    This was a while ago, but from what I remember there were some tags that were not altered at all. I am pretty sure CKEditor will always alter your html, no matter what you do. If that is not true, I would love someone to tell me how to configure it. – KennethDale1 Sep 02 '20 at 18:11
0

adding this into the CKEDITOR.editorConfig function did it for me:

config.allowedContent = true; CKEDITOR.dtd.$removeEmpty = false;

DML
  • 1