Styjun

I need embed the thumbnail from a Youtube video and when I clic on the thumbnail the video start to play.
I got the following php code (see php code below) where the video is embedded but I need the code where the thumbnail is embedded too and it starts to play when you clic on the thumnail. I think the code for the video to start playing is the below of the following one (see js code below).

PHP Code:

<?php
function mininaturas_youtube_func( $atts ) 
$a = shortcode_atts( array(
'id' => ''
), $atts);
return '<iframe width="560" height="315" 
src="https://www.youtube.com/embed/' . $a["id"] . '" frameborder="0" 
allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in- 
picture" allowfullscreen></iframe>';

add_shortcode( 'miniatura_youtube', 'mininaturas_youtube_func' );
?>

Js Code (my try):

$(document).ready(function()
 $("#play").click(function()
 $("#remove").hide();
 $("#add").show();
 );
);

Could you help to include the php code (into the PHP Code section) to embedded the thumbnail of the Youtube video and review the js code?
Thanks

By Using this you can embedded thumbnail to video.

Each YouTube video has 4 generated images. They are predictably formatted as follows:

https://img.youtube.com/vi/<insert-youtube-video-id-here>/0.jpg

https://img.youtube.com/vi/<insert-youtube-video-id-here>/1.jpg

https://img.youtube.com/vi/<insert-youtube-video-id-here>/2.jpg

https://img.youtube.com/vi/<insert-youtube-video-id-here>/3.jpg

The first one in the list is a full size image and others are thumbnail images. The default thumbnail image (ie. one of 1.jpg, 2.jpg, 3.jpg) is:

https://img.youtube.com/vi/<insert-youtube-video-id-here>/default.jpg

For the high quality version of the thumbnail use a url similar to this:

https://img.youtube.com/vi/<insert-youtube-video-id-here>/hqdefault.jpg

There is also a medium quality version of the thumbnail, using a url similar to the HQ:

https://img.youtube.com/vi/<insert-youtube-video-id-here>/mqdefault.jpg

For the standard definition version of the thumbnail, use a url similar to this:

https://img.youtube.com/vi/<insert-youtube-video-id-here>/sddefault.jpg

For the maximum resolution version of the thumbnail use a url similar to this:

https://img.youtube.com/vi/<insert-youtube-video-id-here>/maxresdefault.jpg

All of the above urls are available over http too. Additionally, the slightly shorter hostname i3.ytimg.com works in place of img.youtube.com in the example urls above.

Click For More Answer.