More Books Related to Web development & Blogging

Show Recent Posts v1.0 with Thumbnail Widget in Blogger!

MD M Nauman Friday, 5 February 2016 0 comments

What is Recent Posts 1.0 Widget?

Recent Posts Widget Fetches Your Most Recent Posts With Posts Thumbnails, Published Date, And Number Of Comments To The Posts. By JSON Script And Decorated by using CSS. 

Why To Use Recent Posts Widget?

Recent Posts Widget is recommended Because This Widget Can Fit in Sidebar or in footer section of the site. when the visitors comes from Search engines to a particular post they don't know what is new in the site. if Recent Posts Widget will be there there will be more Page views, internal linking and low bounce-rate if this is there then it is good for SEO.

See The GIF Demo Below After the tutorial you will get this Widget:




Let Start! How To Add  Recent Posts Widget in Blogs or sites:

Steps To Add Recent Comments Widget:

STEP 1: Log in to your Blogger account and Go to your Blogger Dashboard


Blogger Layout

STEP 2: In The Left Side Bar You will find Layout Section as highlighted in the image above Click on Layout.


Add a Gadget


STEP 3: Click On "Add a Gadget" As highlighted in the image above.




STEP 4:After Clicking on "Add a Gadget" Choose "HTML/JavaScript" from the list 
and Open it as highlighted in the image above.


STEP 5: Now Copy This Below Code And Paste it in The Empty Box of the "HTML/JavaScript" Section.

/* Recent Posts by trendingwidgets.com */
<link href="http://www.topfullgames.net/trendingwidgets/responsive/scripts/recentposts.css" type="text/css" rel="stylesheet" /><script src="https://mytopdownloads.com/Trending%20Widgets/recent_posts.js"></script>
  <script type='text/javascript'>
var numposts = 5;
var showpostthumbnails = true;
var displaymore = false;
var displayseparator = true;
var showcommentnum = true;
var showpostdate = true;
var showpostsummary = true;
var numchars = 80;</script>
  <script type="text/javascript" src="/feeds/posts/default?orderby=published&alt=json-in-script&callback=recentPosts"></script>


Customization:

  • The Yellow Highlighted Text is for Number of Posts To Display By Default 5 Posts Will Be Displayed If You Want More Then Change This .
  • The Green Highlighted Text is Responsible For The Thumbnail to appear by default it is true if you want only the title to appear then change the parameter to false.
  • The light blue Highlighted Text is Responsible For The Post Summary and the Length of Post Summary or Excerpts. If You Want More or Less Change this Parameter.
  • The Orange Highlighted Text is Responsible For The Comments numbers and Posts Published Dates if you want to switch of this feature then change the parameter to false.
STEP 6:  All Done Save the Gadget and Check it in your site.

That's It Thanks For Following our Tutorial 'Show Recent Posts v1.0 with Thumbnail Widget in Blogger! '' Along With us If you found any difficulty Please Comment and Share Your Valuable Opinion. And Stay tuned for More Tutorials Like This and Share this with your friends.
Labels:

Hello MD M Nauman is a passionate Web Designer and write Reviews on Games and Software. He love blogging, Designing Blogger templates, Web Developing.

Google+ Pinterest