How to display thumbnails of youtube videos in blogger. 100% working.

If anybody of you have got a video blogging website in blogger, then i assure you that you had this experience, the experience of no display of youtube thumbnails in homepage of blogger. Many members inserts image in the video post for displaying that image as thumbnail in homepage but the problem is that it will also shows up in the video post page also. Like the image below
But we want the thumbnail to display in only homepage but not in the post’s page. Like the image below.
For this we have to hide the image in video post and have to display it in homepage. So how to hide the image in video page? Well I had done a small research about this and made a simple solution. Today im gonna teach you how to display thumbnails of youtube videos in homepage blogger.

Step 1: Embed a Youtube video in a new post 

I hope you people has an better idea about how to embed a video in a post. If you dont know how to embed a youtube video in blogger then read my article How To Embed A Youtube Video In Blogger.

Step 2: Now insert a image in the post

After embedding the video in the post insert a image of your wish before the video. This image be gonna thumbnail of that video so select an proper image. Or read my article How to display particular youtube video’s thumbnail in blogger.

Step 3: Now click on html in the post

Now click on html view of the post and search for style=” and after write display: none; (remember, you will find style=” for many times in the whole code but you have to write the display: none;  property for the image one only. For rest style=” properties you just leave them because they are the properties of video and some other and we are not doing anything for them). see the images below
Clicking on HTML button
 HTML view of a post
finding style=” code
As you can see above there are lot of style=” tags in the code we are going to add display: none; property only to the image but not to anything other as shown in image below
(don’t worry, the property can place any where in the brackets but should start after the ‘;'(semi-colon) of previous property and should end with a ‘;’ (semi-colon))

Step 4: Save and publish the post

Now just save the post and BAM! You got your video thumbnail in home page but not in post page 🙂
Hope i explained you the procedure in well manner, still if you have any doubts let me know through comments 🙂

More Videos

About All Tech Corner 69 Articles
All Tech Corner is all about latest Technology News, updates from the world of mobile phones, gadgets, computers, tricks and tutorials. We work hard to serve you best and to satisfy your hunger of Technology

Be the first to comment

Leave a Reply

Your email address will not be published.


*