How to Make Clean YouTube Screenshots without the Player ButtonssteemCreated with Sketch.

in #tutorial3 years ago

Do you need to make screenshots of YouTube videos for tutorials or thumbnails? If you do, you will notice that when you pause the video to take your screenshot you still have the YouTube player buttons showing up. You could let the videoplay and try to take your screenshot on the fly, but it's far from being a solution.

How to Make Clean YouTube Screenshots without the Player Buttons

I make a lot of YouTube screenshots to make blog posts from Jerry Banfield's videos @jerrybanfield and it took me quite a bit of research to find a solution on how to remove these video player buttons at the bottom of videos.

A normal screenshot when the video is paused is like this:

And we want it to look like this:

In order to achieve this result what you need to do is create a bookmark with a Javascript code in it and that you click to remove the buttons. This work in Firefox and Chrome.

First, what you have to do is to copy the Javascript Code below:

javascript:(function(){var goaway=".ytp-gradient-bottom,.ytp-gradient-top,.ytp-chrome-top,.ytp-chrome-bottom{display:none;}";if("\v"=="v"){document.createStyleSheet().cssText=goaway}else{var tag=document.createElement("style");tag.type="text/css";document.getElementsByTagName("head")[0].appendChild(tag);tag[(typeof"string")?"innerText":"innerHTML"]=goaway}})();

Then, you paste this Javascript Code in a text document like Notepad.

Select the code with your mouse and start moving it to the Bookmark bar like this.

Release it on the Bookmark bar.

Finally, you can edit the Bookmark to give it a name.

All you have to do now is click this Bookmark when you are on a YouTube video.
To pause and start the video, use your keyboard space bar. You can go back and forth using the arrow keys. If you want the YouTube player buttons to show again, refresh the page.

I hope this is useful for you.

There is only one thing that still stick on the screenshot and that is the small YouTube subscribe button at the bottom right. If you know how to modify the Javascript code to make it disappear as well this would be awesome. I am looking forward your comments.

If you found this tutorial useful, please upvote and follow me for more.

Michel Gerard


Great men! Very useful tip!

I am glad you like the tip @davidrestrepo

Great tip Michel!

I am glad you like it Tomas.

Thanks! Much better than my method :)

Thanks for your comment @jerre! Had a good laugh!

Hmm thanks for your precious info :)

My pleasure!