How To Add Random Posts Widget To Blogger
As a blogger it is very good and important certain widget in the sidebar of their blog, so as for readers to easily navigate and access the content of the blog.Today am sharing with you the easiest means to add a random posts widget to your blog.
Steps on How To Add Random Posts Widget To Blogger
Step 1: Log in to your blogger dashboard > Go to Layout and select the ADD A GADGET to add your new sidebar gadget.
You should also read : How To Convert Personal Facebook Account To A Page And Get More Likes
How to Create Lite Version App For Blog without Programming Idea
How To Easily Access And Edit Blogger Template On Android Mobile Device
Step 2: from the pop-up windows choose the HTML/JavaScript.
Step 3: Copy the code below and paste it inside the content box area of the HTML/JavaScript window. Don't forget to put "Recent Posts" in the Title box
<style>
#random-posts img {
float: left;
margin-right: 10px;
width: 65px;
height: 65px;
background-color: #F5F5F5;
padding: 3px;
}
ul#random-posts { list-style-type: none;}
#random-posts li {
margin-bottom: 10px;
}
.random-summary {
display: block;
}
</style>
<ul id='random-posts'>
<script type='text/javaScript'>
var randomposts_number = 5;
var randomposts_chars = 60;
var randomposts_details = 'yes';
randomposts_details2 = 'no';
var randomposts_comments = 'Comments';
var randomposts_commentsd = 'Comments Disabled';
var randomposts_current = [];
var total_randomposts = 0;
var randomposts_current = new Array(randomposts_number);
function randomposts(json) { total_randomposts = json.feed.openSearch$totalResults.$t
}
document.write('<script type=\"text/javascript\" src=\"/feeds/posts/default?alt=json-in-script&max-results=0&callback=randomposts\"><\/script>');
function getvalue() {
for (var i = 0; i < randomposts_number; i++) {
var found = false;
var rndValue = get_random();
for (var j = 0; j < randomposts_current.length; j++) {
if (randomposts_current[j] == rndValue) {
found = true;
break
}
};
if (found) {
i--
} else {
randomposts_current[i] = rndValue
}
}
};
function get_random() {
var ranNum = 1 + Math.round(Math.random() * (total_randomposts - 1));
return ranNum
};
</script>
<script type='text/javaScript'>
function random_posts(json) {
for (var i = 0; i < randomposts_number; i++) {
var entry = json.feed.entry[i];
var randompoststitle = entry.title.$t;
if ('content' in entry) {
var randompostsnippet = entry.content.$t
} else {
if ('summary' in entry) {
var randompostsnippet = entry.summary.$t
} else {
var randompostsnippet = "";
}
};
randompostsnippet = randompostsnippet.replace(/<[^>]*>/g, "");
if (randompostsnippet.length < randomposts_chars) {
var randomposts_snippet = randompostsnippet
} else {
randompostsnippet = randompostsnippet.substring(0, randomposts_chars);
var whitespace = randompostsnippet.lastIndexOf(" ");
randomposts_snippet = randompostsnippet.substring(0, whitespace) + "…";
};
for (var j = 0; j < entry.link.length; j++) {
if ('thr$total' in entry) {
var randomposts_commentsnum = entry.thr$total.$t + ' ' + randomposts_comments
} else {
randomposts_commentsnum = randomposts_commentsd
}; if (entry.link[j].rel == 'alternate') {
var randompostsurl = entry.link[j].href;
var randomposts_date = entry.published.$t;
if ('media$thumbnail' in entry) {
var randompoststhumb = entry.media$thumbnail.url
} else {
randompoststhumb = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiMgUoJG0H5XIs30PUUcNg_t8b_AELRWxpB0WpIX1mXWXm2m5S33UjRcRW0enWySiLMqIa44Om_3XBUxLaFY_DoE0gsToCZqDLOJg2uURLJ9TsKEftaOGwZA6NKj8QPojb_LwWl_0VT9gA/s1600/no_thumb.png"
}
}
};
document.write('<li>');
document.write('<img alt="' + randompoststitle + '" src="' + randompoststhumb + '"/>');
document.write('<div><a href="' + randompostsurl + '" rel="nofollow">' + randompoststitle + '</a></div>');
if (randomposts_details == 'yes') { document.write('<span>' + randomposts_date.substring(8, 10) + '.' + randomposts_date.substring(5, 7) + '.' + randomposts_date.substring(0, 4) + ' - ' + randomposts_commentsnum) + '</span>'
}
if (randomposts_details2 == 'yes') { document.write('<span class="random-summary">' + randomposts_snippet) + '</span>'
}
document.write('<div style="clear:both"></div></li>')
}
};getvalue();
for (var i = 0; i < randomposts_number; i++) { document.write('<script type=\"text/javascript\" src=\"/feeds/posts/default?alt=json-in-script&start-index=' + randomposts_current[i] + '&max-results=1&callback=random_posts\"><\/script>')
};
</script>
</ul>
Recommended : How To Save Mobile Data When Using WhatsApp.
How To Stop And Reduce Overheating Of Smartphone.
Step 4: lastly click on the save button
Congrat you have successfully added the random post widget to your blog ,enjoy!
Yea it works, Thanks for sharing these codes and ideas, information is life just like like health is wealth
ReplyDeleteHealthcare and Fitness Ideas
Thanks! Very useful! Good Job!
ReplyDeleteGreat Post.
ReplyDeletehttp://datemeinfo.blogspot.com
https://datemeinfo.blogspot.com
DATE ME
DATE ME HTTPS
Hey Sir!
ReplyDeleteI hope you are doing Great, This is a very helpful Article for beginners, Thanks For Sharing This Information Keep up the Good Work.
Click Here to Get:- 10 Most Popular Recent Post Widget For Blogger
What a really awesome post this is. Truly, one of the best posts I've ever witnessed to see in my whole life. Wow, just keep it up. The Random Blogger
ReplyDeleteVery cool and helpful. I've been looking for something like that for a long time. Does it take into account all topics to display on the blog?
ReplyDelete