How to Display Recent Posts on Your Blogspot Blog Pages?

Cat Face Cartoon

Step-by-step set up the display of recent posts on each page?

Displaying recent posts on each page of your website or blog can help engage visitors and encourage them to explore more of your content. To set up the display of recent posts, you typically have several options depending on your website platform or content management system (CMS). Below are some general steps that can guide you through the process:

1. Select a Display Location: Decide where you want to display your recent posts. Common locations include the homepage, sidebar, footer, or dedicated "Recent Posts" page.

2. Choose a Method:

• Widget or Plugin: Most CMS platforms like WordPress offer widgets or plugins that make it easy to display recent posts. You can search for and install a plugin like "Recent Posts Widget" for WordPress.
• Code Implementation: If you prefer more control, you can manually add code to your website template. This method may require some HTML, CSS, and PHP knowledge.

3. Access Your CMS Dashboard: Log in to your website's CMS dashboard, such as WordPress, Joomla, Drupal, or a custom-built system.

4. Install a Plugin (WordPress): If you're using WordPress, go to the "Plugins" section and search for a recent posts widget or plugin. Install and activate the one that suits your needs.

5. Configure the Widget/Plugin:

• Set the number of recent posts you want to display.
• Choose the order (newest to oldest or vice versa).
• Customize the appearance (titles, excerpts, thumbnails, date, etc.).
• Determine where you want to display the recent posts (e.g., sidebar, footer, homepage).

6. Save and Publish: Once you've configured the settings, save your changes, and publish them to your website. Your recent posts should now be displayed in the chosen location.

7. Styling (Optional): You can further customize the appearance of your recent posts section by modifying the CSS code if necessary. This step requires some knowledge of CSS.

8. Testing: Make sure to test the display of recent posts on different pages and devices to ensure it looks and functions as intended.

Keep in mind that the specific steps and options may vary depending on your CMS and the theme or template you're using. If you encounter any difficulties or need more specific guidance, consult your CMS's documentation or seek help from your website developer or a web developer with experience in your CMS of choice.

How can I set up the code to display recent posts on each page?

Late Posts enables guests to rapidly observe the latest blog entries on the off chance that they are intrigued. In this post, we'll discuss how to indicate recent posts in the Blogger blog. This will include a gadget and rundown of the most recent blog entries on the Blogger blog. As a matter of course, Google Blogger gives gadgets to "mainstream posts" yet there is no gadget accommodating "late posts". This gadget once added will enable guests to rapidly observe the latest blog entries in the sidebar or wherever you add the gadget to. 

To add a widget, we log in to the Blogger dashboard and navigate to "layout", then click on "add a gadget". If we can find the gadget or widget we want to add, we simply click on the plus sign "+" and the widget is added. I wanted to test this out and search for "recent posts" widgets in Google Blogger but could not find one.

1. To add a recent post widget in the Blogger blog, do the following:
2. Login to Blogger Dashboard > Layout
3. In the template area where you want the widget to appear, click on "Add a gadget"
4. In the gadgets selection window, select "Add HTML/JAVASCRIPT"
5. Copy and paste the code below

<script>var numposts =5; var showpostdate = false; var showpostsummary = false; var numchars = 100; </script>
<script src="http://blogname.blogspot.com/feeds/posts/default?orderby=published&alt=json-in-script&callback=rp">
</script>

Configuration:

Edit blog name: 

blog name: Replace the blog name with your blog name.

The number of recent posts to show:

numposts=5: displays 5 posts. change it to the number of recent post links to show.

Show the post date or not:

show postdate: true or false 

Show post summary or not:

show post summary: true or false

How many characters to show in the post summary?

num chars: enter the number of characters to display

1. Click ok. A widget is added.
2. Click "Save Arrangement"
3. Click on "View Blog" and check if the recent posts widget appears.

If the recent posts do not display, do the following:

1. Click on "Template" from the left Blogger sidebar menu 
2. Click "Edit HTML"Click anywhere in the code area and press Control(CTRL)+F
3. Type "</html> and hit enter to search
4. Paste the code below right above </html>

<!-- FOR RECENT POSTS. The widget also added-->
  <script type='text/javascript'>
//<![CDATA[
function rp(json){document.write('<ul>');for(var i=0;i<numposts;i++){document.write('<li>');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=='alternate'){posturl=entry.link[k].href;break}}posttitle=posttitle.link(posturl);var readmorelink="(more)";readmorelink=readmorelink.link(posturl);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";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,"");document.write(posttitle);if(showpostdate==true)document.write(' - '+monthnames[parseInt(cdmonth,10)]+' '+cdday);if(showpostsummary==true){if(postcontent.length<numchars){document.write(postcontent)}else{postcontent=postcontent.substring(0,numchars);var quoteEnd=postcontent.lastIndexOf(" ");postcontent=postcontent.substring(0,quoteEnd);document.write(postcontent+'...'+readmorelink)}}document.write('</li>')}document.write('</ul>')}
//]]>
</script>
<!-- RECENT POSTS. Widget also added--> 

 Click "Save Template"

Click View Blog and see if the recent posts appear.