Removing the "play on youtube" overlay on embedded videos
Asked Answered
D

8

16

Is there a way to get ride of the "play on youtube" button that is overlayed on videos when they are embedded? I looked into using the chromeless youtube player but couldn't figure out a way to remove the overlay. Has anyone tried or heard of a way to do this?

Denadenae answered 19/12, 2011 at 16:58 Comment(0)
F
28

The three parameters I found useful are:

showinfo=0
controls=0
autohide=1

showinfo=0 makes sure the video does not display the title on the top of the video frame. controls=0 hides the bottom bar with the play button, volume, etc. autohide=1 hides the controls until you hover over them, which is probably the most useful.

All the official docs are here.

Fiorenze answered 15/8, 2013 at 3:4 Comment(2)
autohide has been deprecated. please checkout the iframe player API provided by the answer above.Leitmotif
@JaysQubeXon which answer above?Mauretania
T
19

I found it not possible. So the only way to hide Play button is to place video image above the video which can be fetched from youtube as follow. Each YouTube video has 4 generated images. They are predictably formatted as follows:

http://img.youtube.com/vi/<insert-youtube-video-id-here>/0.jpg
http://img.youtube.com/vi/<insert-youtube-video-id-here>/1.jpg
http://img.youtube.com/vi/<insert-youtube-video-id-here>/2.jpg
http://img.youtube.com/vi/<insert-youtube-video-id-here>/3.jpg

But once you add the overlay, clicking on the screen instead of control will not play the video, To do this add the following jQuery which plays the video

jQuery('#overlay').click(function(){
      jQuery(this).hide();
      jQuery('#youtube_id').get(0).playVideo();

});
Tael answered 27/11, 2013 at 16:43 Comment(0)
D
4

The most voted answer works well now! (Wed Sep 9 '15) You should put the

  1. parameters &showinfo=0&controls=0&autohide=1 Just after the video source code
  2. and without line break in src="..."

I think almost of you missed at above cases.

Followings are my example code.

<div>
    <iframe id="bgVideo" width="800" height="480" frameborder="0" allowfullscreen
     src="//www.youtube.com/v/j-EQgzyoXMk&autoplay=1&loop=1&playlist=j-EQgzyoXMk&showinfo=0&controls=0&autohid=1">
    </iframe>
</div>

It means... don't do like this,

<iframe src="..." showinfo="0" controls="0" autohide="1" ...></iframe>`

or like this,

<iframe src="//www.youtube.com/v/...
             &autoplay=1
             &showinfo=0
             &controls=0
             &autohide=1
             &...></iframe>

and my example's result screenshot.

(I couldn't post images because of my reputation... See here: https://i.sstatic.net/zC5lz.jpg)

Don't forget!

  1. parameters &showinfo=0&controls=0&autohide=1 Just after the video source code
  2. and without line break in src="..."
Death answered 8/9, 2015 at 15:26 Comment(0)
W
2

It is not possible to remove play button from youtube player, Hear are three workarounds for that

1 : autoplay the video

2 : add your own overlay with custom button on over the player using once the button is clicked, then handle the playing and pausing the video using javascript

3 : extract the video content URL (against the youtube policy, but it works and may break at any moment in future)

embedd url :

http://www.youtube.com/embed/VIDEO_ID?autoplay=1&showinfo=0&modestbranding=1&wmode=transparent&controls=1&color=white&rel=0&enablejsapi=1&playsinline=1&&version=3&theme=light&autohide=1&egm=0&showsearch=0&loop=1&playlist=VIDEO_ID"

The above URL will auto play the video if you are using HTML 5 it will not autoplay by default, For that you need to make use of the javascript to autoplay the video.

One more thing : Once the video ends it once again displays the Play Button and Video Info, As pre my knowledge it is unavoidable.

Weider answered 30/10, 2013 at 4:43 Comment(0)
O
0

UPDATE:

Have you tried using the "modestbranding" player parameter see https://developers.google.com/youtube/player_parameters

Example: http://www.youtube.com/v/lT0ReYP3fDA?version=3&controls=0&modestbranding=1&showsearch=0


Removing the “play on youtube” overlay manually is against the Terms of Service.

Your API Client will not, and You will not encourage or create functionality for Your users or other third parties to: modify, replace or otherwise disable the functioning of links to YouTube or third-party websites provided in the YouTube search results or otherwise provided through the YouTube API or YouTube player;

It isn't very well documented but if you break the Terms of Service in anyway Youtube may blacklist your website. What happens is basically every video will return a 105 error code and stop working. This happened to a site I worked on once and it wasn't easy to get in contact with Google to get the blacklisting revoked (after making changes to be in line with the ToS again).

Odds answered 1/3, 2012 at 1:16 Comment(0)
E
0

2017 Answer:

If you're referring to the "YouTube" logo in the bottom-right corner, this can be removed with the info parameter:

showinfo=1

Of course, this causes other info (such as the video title) to be shown as well, which might be undesirable. Still, the logo is hidden! :)

Everest answered 24/8, 2017 at 15:9 Comment(0)
D
0

Unfortunately, on August 19, 2015 the autohide attribute has been officially depreciated. You can no longer remove the play button, without using a modest amount of JavaScript.

The same can be found over here https://developers.google.com/youtube/player_parameters#autohide

Dane answered 6/8, 2018 at 14:41 Comment(1)
Link not working.Villasenor
A
0

There is a ready-made solution that removes “play on youtube” into the background (you can see it a little, but you won't be able to press it).

autoplay=1&controls=2&modestbranding=1

Personally, I work on a website about Russian copywriting exchanges.

Here is an example - https://beecopy.ru/zakazchiku/sovet-workzilla-drobim-bolshie-proekty-na-podjomnye-zadachi/

Amends answered 3/6, 2021 at 12:40 Comment(0)

© 2022 - 2024 — McMap. All rights reserved.