Related Videos and Posts Widget with Thumbnails for Video Blogger

Related Videos Widget with Thumbnails for video blogging

Layout > Edit HTML (It’s always a very good habit to backup your template before whatever you do. No matter how much you know about it, just backup it first of all.) If you are using updated Blogger interface click Proceed Check Expand Widget Templates Now use keyboard shortcut Ctrl + F and find,

and replace it with below code:

Let’s take a break and see what you can change here to adjust the appearance and style of the widget as you want it. Basically you can change highlighted colors in the CSS code as you wish. Or if you know CSS, it’s OK to play with the style a little bit. Then you can change:

 

Maximum number of related posts to display in widget.

 

Color of the splitter between related posts.

 

Title of the widget. and,

 

Default thumbnail to show. That’s all editing. Again use same Ctrl + F and find below line of code

If you can’t find it then try to find this one

If you have changed your template lately, there could be more than just one line. If there are two lines, I suggest you to use the first one. If there are three lines use second. Still can’t figure out? Shoot a comment. Now immediately after any of those lines paste below code.

(I say immediately because related posts should appear after the post right away, right? But if you have decided to add some other codes or widgets like Share buttons, it’s ok to add this below them. The most important thing is locate below code where you need to appear related posts.) That’s it! Ah, there is one thing I forget to mention. I have added ‘Facebook Like button’ and ‘Google Plus button below every related posts. If you have used Facebook like and Google Plus code in your blog, buttons will automatically appear. If you are not willing to use them or having troubles with them let me know. And one last this. I developed this code for a video blog and it works great. But in some situations you may have troubles with implementation. If you have any troubles with the widget shoot a comment. If you had trouble and could figure it out be kind enough to tell it too. Because it sure will help to keep the good work up.

UPDATE: Thanks to ’3dclassic’ I noticesd some troubles with my bloggertube video blogging templete created by dantearaujo.net . So I made a little change with previouse code and made a new one for bloggertube users. So what you have to do is (only if you are a bloggertube user) simply replace:

from the 1st code with:

Then You have to change the location where you paste the second code.Use same Ctrl + F

Comments
  1. mr dun

    is it still working with blogger.com?
    seem cant make it work

    • Gamage AGM

      Yes, it still works with blogger.com. But this won’t have any effect on new HTML5 templates.

  2. Gamage AGM

    Hi, I’m really sorry. I was bit busy so couldn’t check the comments. And
    I got your second comments too. Give me sometime I’ll check it and will
    get back to you quickly.                       

  3. 3dclassic

    i have paste all code as per your instruction but i am unable to display related videos on my blogger.. what i do?

    • Gamage AGM

      Hi,
      I’m really sorry. I was bit busy so couldn’t check the comments. And I got your second comments too. Give me sometime I’ll check it and will get back to you quickly.

    • Gamage AGM

      The code is having troubles with your template. It’s little different when handling the youtube code. So I created a new code for you.

      REPLACE: http://techtweaker.googlecode.com/files/related-videos-with-thumbnails-for-blogger_v1.0.js

      With: 
      http://techtweaker.googlecode.com/files/related-videos-with-thumbnails-for-blogger_bloggertube_v1.0.js 

      Then You have to change the location where you paste the second code. I’ll edit this post since it’s quite long commenting.  

      • 3dclassic

        Thanks Bro:
        Now it is working fine with changing in place of second step of code. my blog is http://www.tvbucket.tk

        • Gamage AGM

          NP. It’s good to see it’s working. :)

    • Admin

      Hi,
      Sorry for the late reply. I was bit busy. What kind of troubles you have with it? Can I see a link where you posted?

ADD YOUR COMMENT

Please note: Only English and related comments will be approved.
Type BLACK color text and click Submit Comment.