YouTube video: embed and not ibed, please (17 posts)

  1. tamar
    Posted 8 years ago #

    Yes, this is the oldest and apparently most frequently-broached topic here. :)

    I believe what the solution is for making the YouTube embed code work. Apparently, it seems that you should not use the WYSIWYG editor (or instead, you should install an extra plugin)...

    BUT.. this is a real big inconvenience when you actually want to use both the WYSIWYG editor. And I don't think that using the code-editor itself is a real solution. I hate hitting "save and continue editing" and then seeing that the YouTube video disappeared because somehow the "embed" tag turned into an "ibed" tag.

    Is there ANY way to not have this happen? I noticed it in 2.0.x and I was hoping it was fixed in 2.1.x but... I'm sadly not finding a suitable solution.

  2. tamar
    Posted 8 years ago #

    Nobody? I'd have really thought that this would have been fixed in v2.1.... why does it do that anyway?

  3. Merlin Silk
    Posted 8 years ago #

    OK, there is a bit of a solution if you run the wp software on your own server and have access to the sources:

    go to the directory wp-includes/js/tinymce

    and edit the file tiny_mce.js
    Look for <em and change the place where you find it to the following

    // Convert all strong/em to b/i in Gecko
    if (tinyMCE.isGecko) {
    h = h.replace(/<strong/gi, '<b');
    //h = h.replace(/<em(\/?)/gi, '<i');//gezi
    //h = h.replace(/<em /gi, '<i');
    h = h.replace(/<\/strong>/gi, '</b>');
    //h = h.replace(/<\/em>/gi, '</i>');

    in other words, just comment these three lines.
    On first test it works now - you will have to clear your cache and restart firefox.

    Very rude fix and I don't know if there are any bad ramifications, but for now it works.

  4. Merlin Silk
    Posted 8 years ago #

    pity - I just updated to 2.1.2 - but that bug is still there - no changes in tiny_mce.js

    not that familiar with js, but it appears it's looking for
    <em instead of
    and so finds <embed

    Don't know what that syntax
    h = h.replace(/<em(\/?)/gi, '<i');
    actually means, otherwise I could correct it more properly and stead of just getting rid of it.

    Is there a bug database for wordpress where we could actually report this as a bug?

  5. Bug reports are welcomed and tracked at http://trac.wordpress.org/ - use your forum user name and password for access.

    In the case of "embed" mangling, the best solution is to avoid inserting that tag, which is not valid XHTML anyway. YouTube and other videos can be inserted, with valid code that won't get mangled using a variety of plugins. Personally, I like Viper's Video Quicktags, but I believe there are others you can try.

  6. tamar
    Posted 8 years ago #

    Thanks for the tips, guys.

  7. douglerner
    Posted 8 years ago #

    I also have the same problems - but with PhotoBucket embed tags. There is no way of turning off that annoying "feature" that converts the embed tags whenever the post is edited?


  8. Capripot
    Posted 8 years ago #

    I think You can add the flash plugin to tinymce
    copy the flash directory from the tinymce downloaded archive :
    to tinymce directory in wordpress : wp-includes/js/tinymce/plugins/
    After that, you should modify the tiny_mce_config.php. Add ", 'flash'" to the $plugins array. Add ", 'separator', 'flash'" to the $mce_buttons array.
    Enjoy Flash in WordPress

  9. spanishcarlos
    Posted 8 years ago #

    I experienced the same problem and, just like everyone else in this post, simply could not find a viable solution.

    I found the article below, which in essence recommends turning your visual editor off, writing the post with the embedded video, and then turning the visual editor back on.

    It seems like a lot of work, I know, but I did it and got it to work. With all the problems I've had with the WYSIWYG editor, I think I'll continue to work with the visual editor off.

    Anyway, here's the link to the article I'm refering to:

  10. gideonstrumpet
    Posted 8 years ago #

    Just to add my 2 cents. I had the same problem with Youtube and then I installed Viper's VideoQuickTags plugin and it now works beautifully. I'd recommend that.

  11. freesecrets
    Posted 7 years ago #

    Viper's plugin has an issue with formating ... every time I used it to put video on my blog it had problem properly displaying all elements in Firefox. And by that I mean any elements below it were overlapping the video.

    That is why I use pasting through source ... as discussed in my article above, mentioned "spanishcarlos"

  12. Jason King
    Posted 7 years ago #

    I just found a really simple solution to this.

    Just copy the YouTube html code into your page or post. Then enclose it in a PRE tag i.e.

    < p r e >youtube code goes here < / p r e >

    The PRE tag indicates preformatted text and WordPress doesn't try to rearrange code contained in it.`

  13. Bill
    Posted 7 years ago #

    Thanks, Jason, for this simple and elegant solution.

  14. liam27
    Posted 7 years ago #

    I've been having a similar problem on my blog (WP 2.3.2 & Blue Box theme) where one day a YouTube clip would be embedded and the formatting would appear as expected. Then some time later the code had automatically changed and screwed with the formatting. I've just tried Jason's PRE tag idea and hopefully it works.

    Thank you!

  15. cstina
    Posted 7 years ago #

    The only problem with the PRE tag is...

    If you have to go back and edit the YouTube tag - after it's "working so great," you'll notice that the PRE tag has stripped the YouTube Embed tag in half.


    Everything after the word "transparent" in the YT tag will be missing.

    So, the PRE tag works great.... if/until you go back to Manage > Post afterward... because the code will have changed :(

    For example:

    It will change it from this:

    <pre><object width="425" height="355"><param name="movie" value="http://www.youtube.com/v/SNtZkEoTbuw&rel=1"></param><param name="wmode" value="transparent"></param><embed src="http://www.youtube.com/v/SNtZkEoTbuw&rel=1" type="application/x-shockwave-flash" wmode="transparent" width="425" height="355"></embed></object></pre>

    To this, (if or when) you try to go back and edit the tag later.

    <pre><object width="325" height="255">
    <param name="movie" value="http://www.youtube.com/v/SNtZkEoTbuw&amp;rel=1"></param>
    <param name="wmode" value="transparent"></param></object></pre>
  16. cryonics
    Posted 7 years ago #

    I wonder if the problem is in TinyMCE or in the WordPress code that formats the code after editing.

    Even if we are using Live Writer, the problem is still here.

  17. whataslacker
    Posted 7 years ago #

    Why can't someone simply come up with a hack to make the code the default when editing? It can't be that hard for someone that knows WP code, can it?

    I see I am not the only person out here that would prefer to have code first followed by visual.


Topic Closed

This topic has been closed to new replies.

About this Topic