I am going to post an awesome styled Text only related post widget for blogger. Actually, related posts widget increase your blog’s bounce rate. Also many related posts widget for blogger look boring and ugly. An those having images will increase up your blog loading time.So, hope you like all of the three. Actually when i was suffering over internet i just found this widget on a blog www.gj37765.blogspot.com So I think that this is important for my user too so i just copies there codes.
Now proceed further and install this simple bu cool Related Post Widget on your blog to increase views and help your visitor to get similar post for there next reading.
Now proceed further and install this simple bu cool Related Post Widget on your blog to increase views and help your visitor to get similar post for there next reading.
Features:
1.) Simple And Beautiful Looking Widget.
2.) Quick To Load And Easy To Install With Good Navigation.
3.) A Small Icon Before Every Line.
4.) Only Text That Make Your Blog Simple And Quick To Load.
5.) Simply The Best.
How To Add In Blogspot?
1.) Go To Your www.blogger.com
2.) Open Your Desire Blog.
3.) Go To HTML.
4.) Click “Edit HTML”
5.) Check On “Expand Widget Template”
6.) Now Do As I Did.
7.) Find This Line Using (CTRL+F) Function.
</head>
And Copy The Below JavaScript Code And Paste It Before/Above It.
<!--Related Post Widget Starts-->
<style> #related-posts { float : left; width : 480px; margin-top:20px; margin-left : 5px; margin-bottom:20px; font : 11px Verdana; font-weight: bold; margin-bottom:10px; } #related-posts .widget { list-style-type : none; margin : 5px 0 5px 0; padding : 0; } #related-posts .widget h2, #related-posts h2 { font-size : 20px; font-weight: bold; margin : 5px 7px 0; padding : 0 0 5px; } #related-posts a { text-decoration : none; } #related-posts a:hover { text-decoration : none; } #related-posts ul { border : medium none; margin : 10px; padding : 0; } #related-posts ul li { display : block; background : url("http://1.bp.blogspot.com/-X0SkFmJ3J_Q/T7Na0d6OADI/AAAAAAAADNM/Ivs78tMFl0I/s1600/%5Bwww.gj37765.blogspot.com%5Drp.png") no-repeat 0 0; margin : 0; padding-top : 0; padding-right : 0; padding-bottom : 1px; padding-left : 21px; margin-bottom : 5px; line-height : 2em; border-bottom:1px dotted #cccccc; } </style> <script src='https://making-different.googlecode.com/svn/trunk/related-posts-widget.js' type='text/javascript'/>
<!--Related Post Widget Ends-->
8.) Now Copy The Below HTML Code And Paste It Where You Want To Show Related Posts Widget.
Like I Suggest To Find These Line Using (CTRL+F) Function.
<div class=’post-footer-line post-footer-line-2’/>
<div class=’post-footer-line post-footer-line-3’/>
</div>
</div>
And Edit The Below HTML Code Then Copy It And Paste It Below/After It.
<!--Related Post Widget Starts--><b:if cond='data:blog.pageType == "item"'><div id='related-posts'><font face='Arial' size='3'><b>Related Posts : </b></font><font color='#FFFFFF'><b:loop values='data:post.labels' var='label'><data:label.name/><b:if cond='data:label.isLast != "true"'>,</b:if><b:if cond='data:blog.pageType == "item"'><script expr:src='"/feeds/posts/default/-/" + data:label.name + "?alt=json-in-script&callback=related_results_labels&max-results=5"' type='text/javascript'/></b:if></b:loop> </font><script type='text/javascript'> removeRelatedDuplicates(); printRelatedLabels();</script></div></b:if><!--Related Post Widget Ends-->
Customization:
1.) If You Want To Increase No Of Related Post, Just Change (max-results=5) To Your Desire.
2.) Save And Done.
It’s quite hard to find a good site. And I think I am lucky enough to have come here. The posts are doing great and full of good insights. I would be glad to keep on coming back here to check for updates! http://celabright.org
Thanks…
all your tips and tricks here are very useful! im so lucky to be here!
Thanks…
A very informative article and lots of really honest and forthright comments made! This certainly got me thinking a lot about this issue so thanks a lot for posting!
we buy houses cash
Thanks…
“Select All the Code” button does NOT work. Script cannot be copied.
http://ramblerwithoutborders.blogspot.com
Use Chrome Or Firefox Dude…