Wordpress and Webdesign Forum go41 » WordPress Code Snippets

  1. The video embedded by WordPress 2.9 hasn't the parameters <param name='wmode' value='transparent' /> and <embed wmode="transparent" ... >.
    This makes it stay above a dropdown menu and any other elements on the
    page. Yes, it is possible to modify the code returned by oEmbed for flash videos!
    You have to use the add_filter function of Wordpress to modify the embed_oembed_html.

    The code below filters the embed code stored by WordPress in the database. Tis code just inserts <param name="wmode" value="transparent"></param> and wmode="transparent" in the required places.

    Create a file functions.php or use the one in your themes folder if there is. Put the code given below before the closing '?>' at the end of this file. As soon this code is in place, it should filter the video object and embed code. The problem of a dissappearing menu should be gone!

    The code snippet for your theme's functions.php:

    function add_transparent($oembvideo) {
    $patterns = array();
    $replacements = array();
    $patterns[] = '/<\/param><embed/';
    $patterns[] = '/allowscriptaccess="always"/';
    
    $replacements[] = '</param><param name="wmode" value="transparent"></param><embed';
    $replacements[] = 'wmode="transparent" allowscriptaccess="always"';
    
    return preg_replace($patterns, $replacements, $oembvideo);
    
    	return $oembvideo;
    }
    add_filter('embed_oembed_html', 'add_transparent');

    please BACKUP original files to be able to step back!!

    Posted 2 years ago #
  2. s0206
    Member

    Hi there

    I tried adding this to my functions file but it made no difference whatsoever. I am using wordpress 3.0.

    Any idea's on how to get it working?

    Thanks in advance

    Posted 1 year ago #
  3. Using WordPress 3.0.1 I just copied the source code of FireFox. For an embeded video the code looks like this with the function above in functions.php

    <object width="450" height="363">
    <param name="movie" value="http://www.youtube.com/v/wLph9-ZkMX8&fs=1"></param>
    <param name="allowFullScreen" value="true"></param>
    <param name="allowscriptaccess" value="always"></param>
    <param name="wmode" value="transparent"></param>
    <embed src="http://www.youtube.com/v/wLph9-ZkMX8&fs=1" type="application/x-shockwave-flash" width="450" height="363" wmode="transparent" allowscriptaccess="always" allowfullscreen="true"></embed>
    </object>

    removed the function it comes out like this

    <object width="450" height="363">
    <param name="movie" value="http://www.youtube.com/v/wLph9-ZkMX8&fs=1"></param>
    <param name="allowFullScreen" value="true"></param>
    <param name="allowscriptaccess" value="always"></param>
    <embed src="http://www.youtube.com/v/wLph9-ZkMX8&fs=1" type="application/x-shockwave-flash" width="450" height="363" allowscriptaccess="always" allowfullscreen="true"></embed>
    </object>

    See the difference in source code?

    On screen you will not see any difference except the movie covered an unfolding menu and stayed above items it should not cover.

    This video above is just a plain URL link to a YouTube Video in a post, sample:
    go to http://themes.go41.de/?wptheme=Barthami_Corporate first to get a theme with this function enabled and than open this post: http://themes.go41.de/2009/12/22/wordpress-2-9-is-using-automatically-embed-of-plain-text-url-videos/

    Posted 1 year ago #
  4. s0206
    Member

    Thank you very much!

    I was embedding the code form youtube rather than just using a plain url. This works great.

    Thanks once again!

    :-)

    Posted 1 year ago #

RSS feed for this topic

Reply

You must log in to post.

Join us! or log in (lost password?):