title: Why can't I embed an iframe into TinyMCE?
body: <p>I've tried every which way, simply pasting an embed iframe from youtube into the embed window of my TinyMCE editor results in the below code which does not render or work correctly in my browser. </p>
  
  <p>To be quite honest I'm not even sure what this outputted garbage is? </p>
  
  <p><strong>TinyMCE output:</strong></p>
  
  <pre><code>&lt;p&gt;&lt;img class="mce-object mce-object-iframe" src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7" width="560" height="315" data-mce-p-src="https://www.youtube.com/embed/GQ2BXqST758" data-mce-object="iframe" data-mce-selected="1"&gt;&lt;/p&gt;&lt;div id="mceResizeHandlen" data-mce-bogus="all" class="mce-resizehandle" unselectable="true" style="cursor: n-resize; margin: 0px; padding: 0px; left: 272px; top: 4.5px;"&gt;&lt;/div&gt;&lt;div id="mceResizeHandlee" data-mce-bogus="all" class="mce-resizehandle" unselectable="true" style="cursor: e-resize; margin: 0px; padding: 0px; left: 539.5px; top: 272px;"&gt;&lt;/div&gt;&lt;div id="mceResizeHandles" data-mce-bogus="all" class="mce-resizehandle" unselectable="true" style="cursor: s-resize; margin: 0px; padding: 0px; left: 272px; top: 539.5px;"&gt;&lt;/div&gt;&lt;div id="mceResizeHandlew" data-mce-bogus="all" class="mce-resizehandle" unselectable="true" style="cursor: w-resize; margin: 0px; padding: 0px; left: 4.5px; top: 272px;"&gt;&lt;/div&gt;&lt;div id="mceResizeHandlenw" data-mce-bogus="all" class="mce-resizehandle" unselectable="true" style="cursor: nw-resize; margin: 0px; padding: 0px; left: 4.5px; top: 4.5px;"&gt;&lt;/div&gt;&lt;div id="mceResizeHandlene" data-mce-bogus="all" class="mce-resizehandle" unselectable="true" style="cursor: ne-resize; margin: 0px; padding: 0px; left: 539.5px; top: 4.5px;"&gt;&lt;/div&gt;&lt;div id="mceResizeHandlese" data-mce-bogus="all" class="mce-resizehandle" unselectable="true" style="cursor: se-resize; margin: 0px; padding: 0px; left: 539.5px; top: 539.5px;"&gt;&lt;/div&gt;&lt;div id="mceResizeHandlesw" data-mce-bogus="all" class="mce-resizehandle" unselectable="true" style="cursor: sw-resize; margin: 0px; padding: 0px; left: 4.5px; top: 539.5px;"&gt;&lt;/div&gt;
  </code></pre>
  
  <p><strong>TinyMCE Settings</strong></p>
  
  <pre><code>tinymce.init({
              plugins: 'link image code',
              relative_urls: false,
              selector: "textarea",
              content_css : "/static/css/style.css",
              plugins : "media",
              media_poster: false,
              media_strict: false,
              // theme_advanced_buttons1_add : "media",
              theme_advanced_buttons1: "code",
              extended_valid_elements : "iframe[src|width|height|name|align]"
          });
  </code></pre>
  
  <p>Does anybody have any idea what I'm doing wrong here? </p>