This post has been marked as old. The code might no longer work. Comments have been disabled as this is no longer maintained. Use the search on the right to find a newer tutorial.

Make Menu visible over Youtube Video

video-menu1

If you have videos on your site and are using a dropdown menu, chances are you’ve run into the issue where the menu goes behind the video. The typical solution is to either reorder the menu so the long dropdown doesn’t intersect with the video, or move the video further down the page.

The way to solve the problem is by making a few small changes to the youtube video’s embed code. If you used the embed code on the site make the following change (adding the transparent parts):

If you’re using the oEmbed feature of WordPress, where you just paste the URL of a Youtube video and it automatically converts it to the embed code, you’ll need to drop this into the functions.php file to make the change to oEmbed.

Bill Erickson is a WordPress Consultant who builds custom websites using WordPress as a CMS and the Genesis framework. He contributes to the WordPress community through free themes, plugins, tutorials, and core patches. He's also a cofounder of the BIL Conference (the open analog to the TED Conference).

Looking for more great tutorials? See them all!

Comments

  1. Adam Baird says:

    Nice. Thanks for posting this.

  2. Bill, you are a life saver! I cannot tell you how frustrated I was with this issue before reading and successfully using your info…to the point of crashing my site with someone’s patch in css. Ugh! There went a wasted hour to get it back.
    Anyhow, altering the embed code is about as easy as it gets.
    http://www.coloradonewhomespecialists.com/
    Keep up the good work.

    Greg Tomlinson

  3. amit says:

    Thanks its really helpful to sort same issue with our website :)
    Thanks again