Add Random Post Widget With Thumbnail In Blogger
In this post I am going to share about how you can Add Random Post Widget With Thumbnail In Your Blogger Blog. This is after so long that I am sharing any trick like this on my blog, I should better keep up with all my niches. Not wasting the time let me get the trick now.
After this you will be able to see some something like in the picture below on your blog.
It can be very helpful to keep your readers on stick to your blog. Readers find it really useful and friendly. To Add Show Random Posts Widget With Thumbnail On Your Blog, just follow these steps -
- Log in to your Blogger account
- Go to Layout and click on "Add Gadget" where you want to add this widget and then select the "Add HTML/Java Code" option
- Title your widget what ever you want to and then copy and paste the code below
_________________________________
<style text-type="CSS">
img.label_thumb {
float:left;
padding:3px;
background:#CCC;
border:1px solid #A4A4A4;
width:100px;
height:75px;
margin-right:10px;
margin-top:10px }
img.label_thumb:hover {
opacity:0.8;
filter:alpha(opacity=80);
-moz-opacity:0.80;
-khtml-opacity:0.8 }
</style>
<script type='text/javascript'>
//<![CDATA[
function labelthumbs(json){document.write('<div>');for(var i=0;i<numposts;i++){var entry=json.feed.entry[i];var posttitle=entry.title.$t;var posturl;if(i==json.feed.entry.length)break;for(var k=0;k<entry.link.length;k++){if(entry.link[k].rel=='replies'&&entry.link[k].type=='text/html'){var commenttext=entry.link[k].title;var commenturl=entry.link[k].href;}
if(entry.link[k].rel=='alternate'){posturl=entry.link[k].href;break;}}
var thumburl;try{thumburl=entry.media$thumbnail.url;}catch(error)
{s=entry.content.$t;a=s.indexOf("<img");b=s.indexOf("src=\"",a);c=s.indexOf("\"",b+5);d=s.substr(b+5,c-b-5);if((a!=-1)&&(b!=-1)&&(c!=-1)&&(d!="")){thumburl=d;}
else thumburl='';}
document.write('<a href="'+posturl+'"><img src="'+thumburl+'"/></a>');
if(i!=(numposts-1))
document.write('');}
document.write('</div>');}
//]]>
</script>
<script type='text/javascript'>var numposts = 4;</script>
<script type="text/javascript" src="http://moneymakingboy.blogspot.com/feeds/posts/default/-/Hacks?orderby=updated&alt=json-in-script&callback=labelthumbs"></script>
_______________________________
# The Blue code is the number of posts you want to show in your widget.# Green Code is the name of the Blog label (alphabet must be same)
- In last just click on the "SAVE" button and you are done.
Be the first to comment