CODEWITHSUNDEEP
javascripthtmliframeyoutubeyoutube-api
Rohit Kumar
Rohit Kumar

Reputation: 849

Is it possible to only remove the "watch later" and "share" buttons from youtube iframe embed player

How can I remove the watch later and share buttons from youtube iframe embed player. Using the following embed code for embedding video clips.

<iframe width="854" height="480" src="https://www.youtube.com/embed/cPVgwz5aN1o" frameborder="0" allowfullscreen></iframe>

Using showinfo=0 removes the full Header which also contains the Video Title.

Is it possible to only remove "Watch Later" and "Share" buttons from the header?

Upvotes: 35

Views: 116422

Answers (9)

Gabriel Beauchemin-Dauphinais
Gabriel Beauchemin-Dauphinais

Reputation: 376

As it is not possible, some possible alternatives if the share button is not wanted:

  • Add an invisible div with position absolute on top to disactivate the share button if clicked. Or the div could open a modal or something like this with another implementation that is more interested for the use case.
  • Add an icon/image on top.
  • If it is correct, in the use case to make the player smaller, the share and play later buttons will change into a "..." icon. So like the first alternative, it is possible to add an invisible div on top that when clicked will open your own modal with the actions that you implement.
  • Use Video.js with its YouTube plugin to have your own customizable player without the share button and watch later icons. The video will still be hosted on YouTube of course.
  • Choose another video platform that YouTube

Upvotes: 0

Kermit
Kermit

Reputation: 6032

Use a url query string ?controls=0 to control what is shown:

<iframe 
    src="https://www.youtube-nocookie.com/embed/j8xbAwurfgo?controls=0&rel=0&modestbranding=1&origin=https://key.bio" 
    frameborder="0" 
    allow="encrypted-media;" 
    allowfullscreen>
</iframe>

YouTube Player API Reference for iframe Embeds https://developers.google.com/youtube/iframe_api_reference

Note: this only worked for me on Chrome, not Firefox! Took me a while to figure this out because I use FF for webdev

Upvotes: 0

monkey from Tanzania
monkey from Tanzania

Reputation: 526

This parameter is deprecated and will be ignored after September 25, 2018.

showinfo=0 it's not support anymore

Upvotes: 18

Damian Bennett
Damian Bennett

Reputation: 21

showinfo

Note: This parameter is deprecated and will be ignored after September 25, 2018.

Supported values are 0 and 1.

Setting the parameter's value to 0 causes the player to not display information like the video title and uploader before the video starts playing.

If the player is loading a playlist, and you explicitly set the parameter value to 1, then, upon loading, the player will also display thumbnail images for the videos in the playlist.

https://developers.google.com/youtube/player_parameters

Upvotes: 2

b00t
b00t

Reputation: 419

As an example, this is what you're trying to do:

document.getElementsByTagName('iframe')[0].contentWindow.getElementsByClassName('ytp-watch-later-button')[0].style.display = 'none';

But, short answer, there is no simple way to do this, because YouTube is on a different domain:

'Not possible from client side . A javascript error will be raised "Error: Permission denied to access property "document"" since the Iframe is not part of your domaine...' https://stackoverflow.com/a/30545122/2488877

Though, you might find an answer suitable to your needs if you're tech-savvy in the answers to the question above.

Upvotes: 6

user6451184
user6451184

Reputation:

Using YouTube embed's privacy-enhanced mode (youtube-nocookie), it will hide "Watch later" button, but not "Share" button.

<iframe width="854" height="480" src="https://www.youtube-nocookie.com/embed/cPVgwz5aN1o" frameborder="0" allowfullscreen></iframe>

Upvotes: 29

Deendyal Agarwal
Deendyal Agarwal

Reputation: 101

Add this line after link

https://www.youtube.com/embed/c5cHjtspa7M?mode=opaque&amp;rel=0&amp;autohide=1&amp;showinfo=0&amp;wmode=transparent

It will disable the share and watch later option

Upvotes: 2

Martin Nantel
Martin Nantel

Reputation: 77

In the url params put the params : showinfo=0.

Like this : https://www.youtube.com/embed/youidvideo?autoplay=1&rel=0&showinfo=0

It will remove share and watch later button!

Upvotes: 1

RichardB
RichardB

Reputation: 2771

I don't think it is possible with the iframe method. My reasons for thinking that is:

  • It is not an option listed on their parameters page
  • I found this thread where a member of their team said it was not possible at the time (2012), and they had no plans to add the ability.

You could probably achieve something similar by turning showinfo off, and using the other methods to grab the video title.

Upvotes: 5

Related Questions