Blogger Latest Posts is now a trending widget in Blogger. Blogger Recent Posts are important to show that what your posted just now. Blogger Latest Posts widgets can increase your page views and also be good for your SEO.
Displaying Blogger Latest Posts is a most beneficial idea to keep your readers busy because then not always land on your home page so when they land posts page then how will they know about your Latest posts so add this widgets on your post page to increase your page views. There are many more available on internet but this one is full featured with all data to show what you want.
Table of Contents
Features:
1.) Pure JavaScript Added.
2.) No JQuery File Added.
3.) No CSS Added.
4.) Simple And Fast Loading Code.
5.) Can Work With Any Browser.
6.) Work With Any Blogger Domain.
7.) Can Set The Post Count, Post Thumbnails, Read More, Comment Count, Comment Link, Post Date, Post Summary, Character Count.
8.) Plain In Design.
9.) Fully Customizable With Your Design.
10.) Can Control Everything.
How To Add In Blogspot?
1.) Go To Your www.blogger.com
2.) Open Your Desire “Blog”.
3.) Go To “Layout”.
4.) Click “Add A Gadget” Where You Want To Add It.
5.) Now Scroll To “HTML-JAVASCRIPT”
6.) Click “+” Icon To Add It.
7.) Now “Copy” The Below Code And “Paste” It To There.
8.) Leave The “Title” Empty.
9.) Click “Save”, Now You Are Done.
JavaScript:
<script style='text/javascript'> var numposts = 5; var showpostthumbnails = true; var displaymore = true; var showcommentnum = true; var showpostdate = true; var showpostsummary = true; var numchars = 500; function blogLatestPost(json) { 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 { 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 = 'http://www.webaholic.co.in/other/no-image.jpg'; } } catch (error) { thumburl = entry.media$thumbnail.url; // 72x72 Image } var postdate = entry.published.$t; var cdyear = postdate.substring(0, 4); var cdmonth = postdate.substring(5, 7); var cdday = postdate.substring(8, 10); var monthnames = new Array(); monthnames[1] = "Jan"; monthnames[2] = "Feb"; monthnames[3] = "Mar"; monthnames[4] = "Apr"; monthnames[5] = "May"; monthnames[6] = "Jun"; monthnames[7] = "Jul"; monthnames[8] = "Aug"; monthnames[9] = "Sep"; monthnames[10] = "Oct"; monthnames[11] = "Nov"; monthnames[12] = "Dec"; document.write('<div id="mainDIV">'); if (showpostthumbnails == true) document.write('<img class="post_img" src="' + thumburl + '"/>'); document.write('<h2 class="post_heading">' + posttitle + '</h2>'); if ("content" in entry) { var postcontent = entry.content.$t; } else if ("summary" in entry) { var postcontent = entry.summary.$t; } else var postcontent = ""; var re = /<\S[^>]*>/g; postcontent = postcontent.replace(re, ""); // Will Show Only Text Instead Of HTML if (showpostsummary == true) { if (postcontent.length < numchars) { document.write('<span class="post_summary">'); document.write(postcontent); document.write('</span>'); } else { document.write('<span class="post_summary">'); postcontent = postcontent.substring(0, numchars); var quoteEnd = postcontent.lastIndexOf(" "); postcontent = postcontent.substring(0, quoteEnd); document.write(postcontent + '...'); document.write('</span>'); } } var towrite = ''; document.write('<strong class="post_footer">'); if (showpostdate == true) { towrite = 'Published On: ' + towrite + monthnames[parseInt(cdmonth, 10)] + '-' + cdday + '-' + cdyear; } if (showcommentnum == true) { if (commenttext == '1 Comments') commenttext = '1 Comment'; if (commenttext == '0 Comments') commenttext = 'No Comments'; commenttext = '<br/><a href="' + commenturl + '" target ="_blank">' + commenttext + '</a>'; towrite = towrite + commenttext; } if (displaymore == true) { towrite = towrite + '<br/><a href="' + posturl + '" target="_blank">Read Full Article --></a>'; } document.write(towrite); document.write('</strong></div>'); } } </script> <script src='https://247news-blogger-template.blogspot.com/feeds/posts/default?orderby=published&alt=json-in-script&callback=blogLatestPost&max-results=999999'></script>
Customization:
1.) Edit Your JavaScript Options As Per Your Requirements. Rest Is Ok For General Us. If You Are Pro, Then You Can Do Any Thing.
Last Words:
That’s all we have. If you have any problem with this code in your blogger template then feel free to contact us with full explanation of your problem. We will reply you as time allow to us. Don’t forget to share this with your friends so they can also take benefit from it and leave your precious feedback in our comment form below. Happy blogging, See you in next article…
Hi,
Neat post presented in a simple way, a best one for all the bloggers 🙂
Welcome here and thanks for reading our article and sharing your views.
Thanks a lot for this post
Welcome here and thanks for reading our article.
Great post man, keep going and do post some quality post everytime.
Welcome here and thanks for reading our article and sharing your views.
Blogger is free source to spread your business. we should teach how to manage a beautiful blog.
Welcome here and thanks for reading our article and sharing your views.