CODEWITHSUNDEEP
javascripthtmliframetinymcetinymce-4
Felix
Felix

Reputation: 5629

TinyMCE iframe doesn't be shown

I have a problems with tinyMCE editor.

I want to embed a youtube Video as Iframe, But the video isn't shown in edit mode, edit mode looks like this:

enter image description here

And in live mode there is only the iframe code shown. What can I do to solve this?

enter image description here

Problem is that in the view the code looks like this:

<iframe src="https://www.youtube.com/embed/jkMUwoIQ2wI" width="560" height="315"></iframe>

UPDATE: tinyMCE init js code:

var tinyMCEOptions = {
    mode : "exact",
    elements: "tinyMCE",
    plugins : 'advlist autolink link image lists charmap textcolor print preview media code',
    menubar: "edit insert format view",
    toolbar: [ "undo redo bold italic underline strikethrough forecolor backcolor aligncenter alignright alignjustify | cut copy paste bullist numlist outdent indent blockquote removeformat subscript superscript",
    " styleselect formatselect fontselect fontsizeselect | image media | code"],
    entity_encoding : "raw",
    extended_valid_elements:"iframe[src|title|width|height|allowfullscreen|frameborder|class|id]"
}

extended_valid_elements:"iframe[src|title|width|height|allowfullscreen|frameborder|class|id]",

Upvotes: 1

Views: 6576

Answers (2)

Tushar Rathod Roy
Tushar Rathod Roy

Reputation: 27

https://www.tiny.cloud/docs/plugins/premium/pageembed/

Open the link and set configure according to TinyMCE doc

tinymce.init({
  selector: 'textarea',  // change this value according to your HTML
  plugins: 'pageembed',
  menubar: 'view',
  toolbar: 'pageembed'
});

Upvotes: 0

Cagatay Ulubay
Cagatay Ulubay

Reputation: 2559

I think it's because there is an iframe filter for TinyMCE.

You have to change the filter so iframes not filtered.

Look here: https://wordpress.stackexchange.com/questions/62729/when-switching-from-html-to-visual-editor-the-iframe-tag-gets-corrupted

edit

Open file: tinymce/plugins/media/plugin.min.js

Find: a.parser.addNodeFilter("iframe,video,audio,object,emb

Replace with: a.parser.addNodeFilter("video,audio,object,emb

Save and try again.

Upvotes: 3

Related Questions