How to add related post for blogger
1. Log it to your blogger and go to Design >> Edit HTML
2. First,download the present template as a backup.
3.Make sure you put check mark to “Expand Widget Templates”
4.Find this tag by using Ctrl+F
* If you want to add more post , change the value of maxNumberOfLabels
* If you want to add more label, change the value of maxNumberOfPostsPerLabel
6. Now click save template you are done.
1. Log it to your blogger and go to Design >> Edit HTML
2. First,download the present template as a backup.
3.Make sure you put check mark to “Expand Widget Templates”
4.Find this tag by using Ctrl+F
<data:post.body/>
5. Paste below code after <data:post.body/>
tag<!--related post started--> <b:if cond='data:blog.pageType == "item"'> <div class='similiar'> <div class='widget-content'> <h2>Related post</h2> <div id='data2007'/><br/><br/> <script type='text/javascript'> var homeUrl3 = "<data:blog.homepageUrl/>"; var maxNumberOfPostsPerLabel = 5; var maxNumberOfLabels = 3; maxNumberOfPostsPerLabel = 5; maxNumberOfLabels = 3; function listEntries10(json) { var ul = document.createElement('ul'); var maxPosts = (json.feed.entry.length <= maxNumberOfPostsPerLabel) ? json.feed.entry.length : maxNumberOfPostsPerLabel; for (var i = 0; i < maxPosts; i++) { var entry = json.feed.entry[i]; var alturl; for (var k = 0; k < entry.link.length; k++) { if (entry.link[k].rel == 'alternate') { alturl = entry.link[k].href; break; } } var li = document.createElement('li'); var a = document.createElement('a'); a.href = alturl; if(a.href!=location.href) { var txt = document.createTextNode(entry.title.$t); a.appendChild(txt); li.appendChild(a); ul.appendChild(li); } } <!--Bloggertrix.com--> for (var l = 0; l < json.feed.link.length; l++) { if (json.feed.link[l].rel == 'alternate') { var raw = json.feed.link[l].href; var label = raw.substr(homeUrl3.length+13); var k; for (k=0; k<20; k++) label = label.replace("%20", " "); var txt = document.createTextNode(label); var h = document.createElement('b'); h.appendChild(txt); var div1 = document.createElement('div'); div1.appendChild(h); div1.appendChild(ul); document.getElementById('data2007').appendChild(div1); } } } function search10(query, label) { var script = document.createElement('script'); script.setAttribute('src', query + 'feeds/posts/default/-/' + label + '?alt=json-in-script&callback=listEntries10'); script.setAttribute('type', 'text/javascript'); document.documentElement.firstChild.appendChild(script); } var labelArray = new Array(); var numLabel = 0; <b:loop values='data:posts' var='post'> <b:loop values='data:post.labels' var='label'> textLabel = "<data:label.name/>"; var test = 0; for (var i = 0; i < labelArray.length; i++) if (labelArray[i] == textLabel) test = 1; if (test == 0) { labelArray.push(textLabel); var maxLabels = (labelArray.length <= maxNumberOfLabels) ? labelArray.length : maxNumberOfLabels; if (numLabel < maxLabels) { search10(homeUrl3, textLabel); numLabel++; } } </b:loop> </b:loop> </script> </div> </div> </b:if> <!--related post end-->
* If you want to add more post , change the value of maxNumberOfLabels
* If you want to add more label, change the value of maxNumberOfPostsPerLabel
6. Now click save template you are done.
very useful tutorial,thanks.
ReplyDeletenic thanx
ReplyDeletehttp://worldofdefense.blogspot.com/2011/05/sukhois-detected-aircraft-like.html
ReplyDeleteThis is a much better gadget it shows you related news too and if the tags are not found it gives you an option to search too and on the home page it brings all kind of news and posts
thnks
ReplyDeleteI tried this in my blog but its not working I wonder why? Hope you can help me . Thanks
ReplyDeletevery nice: it really helps on my blog: http://stuffyoumaylike.blogspot.com
ReplyDeleteI have now a related post..:) thanks for sharing..
thanks for this but it does not support my blog.
ReplyDeleteMy blog is :
Http://Musicnightmare.blogspot.com
hey admin, i have a problem finding in my blog and so i dn't knw whr to paste this code...hope you can help me out with it...http://webtrends2011.blogspot.com -this is my blog...waiting for ur reply..
ReplyDeletethanks for this. really worked on http://trueinternetworld.com
ReplyDelete@ Edward, you have to find a tag, showing on 4th step.after found it,you can paste the code.
ReplyDeleteThanks, it works on my blog!
ReplyDeleteHttp://igoroyoroyo.blogspot.com :D
Thanks for your Trick,.. :-)
ReplyDeletethanks pal. this works perfect of me check it on http://www.trueinternetworld.com
ReplyDeletethank you very much
ReplyDeleteThanks..its really nice
ReplyDeleteHello Dear,
ReplyDeleteIts not working for me. Is it a fault in my template ?
Wiki For You
Thanks.
working perfectly. but labels are black. how to change their colour.
ReplyDeletehttp://shirdisaibhajanlyrics.blogspot.com/2011/04/hamsar-hayat-ganesh-vandana-lyrics.html
Thanks alot for sharing with us,i will install this widget after this
ReplyDeleteThanks for sharing this.........
ReplyDeleteHow to change the color of the relates posts and the links please tell me.
ReplyDeletenice widget i've try it on my blogs, thank you its work fine
ReplyDeleteThanks for sharing.
ReplyDeleteThanks for sharing for my blog xay dung use this very resonable
ReplyDeletethanx! :)
ReplyDeletethanks you very much, I searched this and found it here
ReplyDeleteHow can I remove the labels. I just want it to show related posts but hide the label. Thanks!
ReplyDeletewww.allgreektoyou.com
Nice post, thanks for sharing
ReplyDeletevery nice: it really helps on my blog: http://mytopfreeware.blogspot.com
ReplyDeleteI have now a related post..:) thanks for sharing..
Thanks friend I used this script to my blog.
ReplyDeleteThanks Bro ! it's working, with my poor css knowledge, customize it. Take a look http://epsvector.blogspot.com/
ReplyDeleteThank you very, i have try to use linkwithn and other, but it make my blog load slower, but with this..... COOOOOOL!!! Thanks ;)
You should try zemanta. Cool
DeleteThank you so much for this post, i did it. Can I ask something from the author who wrote this tips? I am looking for "related post widget for blogger" but this time, a related post widget with a little sentence (summary snippet).
ReplyDeleteWordpress has a tutorial for that, but in blogger I am trying hard to find that kind of codes, please post it if you have already that blogger tutorials.
That related post with summary snippet could also help blogger using blogger.com in terms of SEO. Thanks for your time. I am looking forward to see your blog updates.
Please comment on any pages in my blog at Gilbert Canda so that I will be reminded, I am really looking for that tutorial. I highly appreciate your effort in sharing blogger customization.
Hello and thanks for the tutorial, i tried to incorporate this code but nothing seems to happen, what could be the problem, thanks
ReplyDeletehttp://mastercircuits.blogspot.com/
thanks it work like charm
ReplyDeletethank so much
ReplyDelete