Ckeditor 4+ Встроенное редактирование с помощью iFrame: Код не написан правильно

Question

Я использую Ckeditor 4+ для встроенного редактирования. Когда изменения применяются к div с атрибутом contenteditable, они записываются в базу данных.

Когда я хочу отображать содержимое (теперь без встроенного редактора), iFrames отображаются неправильно.

Вместо того, чтобы показывать ярлык iFrame, создается метка img . В моем понимании тег img используется во время встроенного редактирования, чтобы не показывать содержимое iFrame.

Когда я поставил следующий Iframe в базу данных,

<iframe src="//www.youtube.com/embed/VIDEOLINK" frameborder="0" allowfullscreen=""></iframe> 

, а затем отобразить его в встроенный редактор, он показывает IMG тег. Когда я изменить содержимое и сохранить его в базу данных, следующий код производится:

<img 
class="cke_iframe" 
data-cke-realelement="%3Ciframe%20src%3D%22%2F%2Fwww.youtube.com%2Fembed%2FVIDEOLINK%22%20frameborder%3D%220%22%20allowfullscreen%3D%22%22%3E%3C%2Fiframe%3E" 
data-cke-real-node-type="1" 
alt="IFrame" 
title="IFrame" 
align="" 
src="data:image/gif;base64,R0lGODlhAQABAPABAP///wAAACH5BAEKAAAALAAAAAABAAEAAAICRAEAOw==" 
data-cke-real-element-type="iframe" 
data-cke-resizable="true"> 

вместо тега с IFrame.

Я добавил в config.js файл следующую строку:

config.allowedContent = true; 

Что я делаю неправильно? Благодарим вас за помощь.

Answer 1

Что я делаю неправильно?

Вы пытаетесь получить HTML непосредственно из редактируемого элемента, вместо получения данных из редактора. Это две совершенно разные вещи. Что внутри CKEditor не то, что вас интересует, если вы, конечно, не пишете плагин для CKEditor. Вы хотите получить данные, используя editor.getData(), и все.

Answer 2

в config.js

CKEDITOR.plugins.registered['save']={ 
     init : function(editor){ 
      var command = editor.addCommand('save', { 
       modes : { wysiwyg:1, source:1 }, 
       exec : function(editor, bla) { 
        //saveEditor(editor.document.getBody().getHtml()); 
        saveEditor(editor.getData()); 
       } 
      }); 
     editor.ui.addButton('Save',{label : '',command : 'save'}); 
     } 
    };