ckeditor doesn´t read media embed code

Question

I use the media embed plugin for ckeditor. It works fine, the code is correctly saved in the database and youtube, soundcloud etd. players display ok on the page. But when the user goes to his administration, where he can edit the info, the text inside and with the tags is not showing, so when the user clicks on the save button, all previously saved iframes will be "erased" and only the rest of the formatted text will be saved. Is there any way to display the iframe code in the ckeditor?

Answer 1

I assume that you use CKEditor 4.1.x which comes with Advanced Content Filter (ACF). Most likely, the point is that you use different editors for frontend/backend editing.

Each plugin extends allowedContent property with own rules for tags, attributes and classes. Using those rules, editor automatically strips out undesired contents, so for example, if your fronted editor allows <iframe> because it has mediaembed plugin loaded, then your backend editor without this plugin will remove your <iframe> from the content.

Furthermore, ACF also observes your toolbar configuration so even if you include the plugin but you don't want the button in the toolbar, any content the button provides (i.e. <iframe>) will also be disallowed in editor's output.

You can easily check whether your editor accept <iframes>. Basically call the following and see the output:

CKEDITOR.instances.yourInstance.filter.check( 'iframe' );
>>> true // it's allowed

If it's false, then there are several solutions for your problem:

1. Enable mediaembed plugin in your backend editor (with button in the toolbar).
2. Extend config.extraAllowedContent to have it back again.

While the first solution is straightforward, the second one might be tricky for you. allowedContent rule for mediaembed plugin is as follows (see plugin's code):

allowedContent: 'iframe[*]' // stands for: iframe element with any attribute

If you add the following to your backend editor's config, you will have iframes back in your content without loading mediaembed plugin:

config.extraAllowedContent = 'iframe[*]'

If this solution doesn't work for you, please provide editor configs and CKEditor version so that people could help you.

Answer 2

CKEDITOR.config.allowedContent = true;

work for me.

Answer 3

To allow CKEditor to store custom HTML without it disappearing, you need to set the allowed content flag to true.

var allowedContent = true; // to allow custom html like iframe or div's

CKEDITOR.replace('yourEditorWindowsId', {
    allowedContent
},

Answer 4

Open ckeditor.js file, then search string : ({elements:{iframe:function(b){return a.createFakeParserElement(b,"cke_iframe","iframe",!0)}}})

in function(b){..} replace function(b){return b}

Here is new one : ({elements:{iframe:function(b){return b;/* a.createFakeParserElement(b,"cke_iframe","iframe",!0)*/}}})

It work for me enter image description here