Modify The YouTube Player Color And Theme - gHacks Tech News

Modify The YouTube Player Color And Theme

You may recall that YouTube started rolling out a new player and site design not so long ago. The redesign, announced about a month ago, made several changes to the video hosting website. Probably the change with the biggest impact was the switch from a light themed played to a dark themed player.

Back then it was not clear if and how embedded players would benefit from the design change. A post on Friday revealed that YouTube plans to roll our a dark player design for YouTube embeds from August 10 on. From that day on, all embedded YouTube videos will sport a new dark player design.

youtube-dark-player-embed

The design change can be problematic on websites that use a lighter theme. YouTube for exactly this situation has added two new player parameters to the YouTube embedded player.

The new theme parameter defines the overall theme of the embedded player. Available options are dark or light. The color parameter on the other hand defines the color of the time bar which can either be red or white.

The default theme and color is set to dark and red. A total of three additional designs are available.

youtube themes

If you do not want the default dark themed played to show up on your site, you need to modify the player code manually. This could be problematic for webmasters who have embedded lots of YouTube videos on their web properties. Probably the best option for those webmasters is to create a script that modifies all embedded YouTube scripts on the website automatically.

The code to embed YouTube videos looks like this. Take notice of the parameters theme and color in the video url.

<iframe width="560" height="349"
src="https://www.youtube-nocookie.com/embed/9h1swNWgP8Q?theme=light&color=red"
frameborder="0" allowfullscreen></iframe>

Here you define the theme and color that you want to be displayed on your website. What's your take on the new YouTube layout and embedded player layout? Good change, bad change?

Advertisement

We need your help

Advertising revenue is falling fast across the Internet, and independently-run sites like Ghacks are hit hardest by it. The advertising model in its current form is coming to an end, and we have to find other ways to continue operating this site.

We are committed to keeping our content free and independent, which means no paywalls, no sponsored posts, no annoying ad formats or subscription fees.

If you like our content, and would like to help, please consider making a contribution:


Previous Post: «
Next Post: »

Comments

  1. B. Moore said on August 9, 2011 at 9:03 am
    Reply

    Sure wish they would let us completely skin it except the YouTube logo for free and then if you spend a little $$ you can remove the Youtube logo for your own logo.

    1. Martin Brinkmann said on August 9, 2011 at 9:09 am
      Reply

      I think it is already possible to remove the YouTube logo.

  2. zack said on August 9, 2011 at 9:14 am
    Reply
  3. Glenn said on August 10, 2011 at 9:42 am
    Reply

    Martin. I’m not sure if you already know about this or not, and I may have even originally got it from Ghacks, but if embedding a YouTube video on a blog or website, it can also be altered to match here: http://www.vtubetools.com/

  4. Micah said on August 11, 2011 at 11:03 am
    Reply

    I embedded a video on http://www.ccli.de/cvl-filmlizenz/.
    Since I do not want related videos to be displayed when the video has been played I use “?rel=0”
    But then “?theme=light&color=red” doesn’t do the trick anymore.
    So you need to change it to “?rel=0&theme=light&color=red” Note the & instead of the ? before the theme.

  5. H said on September 19, 2011 at 7:52 pm
    Reply

    Is it possible to get the white player on normal YouTube? I had it for like 2 minutes once, and then changed back. It looks a lot better, nicer, less gradient banding and blends with the page.

  6. Monica said on September 4, 2014 at 12:40 am
    Reply

    No way to change the background ?

  7. Saavn video said on April 29, 2017 at 10:10 pm
    Reply

    i want to change embed video player setting on saavnvideo.com. please any body help me.

Leave a Reply

Check the box to consent to your data being stored in line with the guidelines set out in our privacy policy

Please note that your comment may not appear immediately after you post it.