WordPress Recent Posts – How to Display Recent Posts in Pages

How to Display Recent Posts on WordPress PagesHaving a means by which users can access recent posts on your WordPress website can increase your sites’ traffic, reduce bounce rate, and improve user experience.

Think of it this way, a user comes across a link to post on your website, either on search engine result pages or through social media platforms. Without showing a means to access recent or related posts, the user will likely leave your page after reading the post.

This will have consequences on your site SEO due to high bounce rate. For this reason, you need to ensure your page is interactive and engaging. One way of doing this is by adding a recent post widget or section to your page.

In this guide, you will learn the benefits of showing WordPress recent posts on your pages. Then we will show you 3 methods you can use to display recent posts on your website. Sounds interesting? Let’s get started.

Content:

  1. Benefits of Showing Recent Posts in WordPress
  2. How to Display Recent Posts on WordPress Page
  3. Conclusion

Benefits of Showing Recent Posts in WordPress

Whether you are using WordPress as a professional website, an ecommerce store, or a community forum, having a page to display your blog posts has a lot of advantages. Here are some of the benefits of displaying recent WordPress posts.

Reduces Bounce-rate

A high bounce rate occurs when users exit your page as soon as they view a particular resource. This can negatively impact your sites’ ranking on search engines.

When you show recent posts on your WordPress page, it gives users more information and access to more posts on your website.

A user will most likely want to view another post on your website after reading an interesting/educative content piece.

Increases Pageviews

When users engage with your content (i.e., reading multiple articles), it results in more page views for your website due to an increase in engagements. Additionally, if you are monetizing your traffic, an increase in page views translates to an increase in income.

Improves On-Page SEO

Linking sufficiently to other resources on your WordPress page is an important factor that can improve your sites’ SEO.

Displaying recent posts on your page makes it easy for your viewers to find other resources on your site. This in turn will improve your websites’ on-page Search Engine Optimization.

Improves User Experience

If you are building a professional website for your brand, chances are that you would use a static page for your homepage.

In such a scenario, you should add a means to access recent posts on your sites’ homepage. This improves user experience and boosts engagement on your content.

How to Display Recent Posts on WordPress Page

There are 3 methods you can achieve this on your WordPress website. You can either use the default WordPress widget, WordPress plugins or manually add the code to display recent posts on a WordPress page.

We will start with the easiest method, then work our way up to a more technical method.

Default WordPress Options

WordPress provides two ways to add this feature by default. The first option is the Gutenberg block editor that comes with the “latest post” block.

You can add this block to your WordPress posts and pages to display recent posts on your website. The second option lets you display recent posts as a widget on any section of your website such as the sidebar or footer area.

Gutenberg Latest Posts Block

This method is easy and does not require any technical knowledge to get started. We recommend using this method if you need a simple setup process.

The recent post widget can be added to any section on a page or post. To start, create a new page or open the page on which you want to display the widget.

After that, add a title for the page. We used “Recent Posts” for this guide, but you can choose any name you prefer.

Gutenberg Post block

Now, click on the Add block (plus) icon and then type “latest posts” in the search bar. When the options appear, select the Latest Posts Gutenberg block.

Latest post block

After the block is added, type in a name for the block, such as “Recent Posts”. On the right, you will find extra customizations such as showing the post date, showing author name, or displaying featured images for your posts.

Under “Image Size”, you can set the size of your featured image. The default is set to Thumbnail image.

Post settings - Display recent posts on WordPress page

When editing, you would see a preview of the widget on the content area. Any change you make will immediately reflect on the preview. You can click on the grid icon to change the layout of the posts.

Editing the block

Once you are done customizing, click on the Publish/Update button to save your changes. You can preview the post or page on your browser to see how the recent post lists look on your site.

Using Widgets – Block Widget Editor

This widget is helpful if you want to display recent posts on other sections of your website such as the footer or sidebar areas.

To use this widget, navigate to Appearance >> Widgets from your WordPress dashboard. Next, select the widget area on which you intend to display the widget (you can choose any widget area your theme supports).

WordPress widgets

After that, click on the Plus icon on the section you wish to display the widget. On the search box, enter “latest post”. Select the Latest Posts widget once found.

Add block to Widget

From here, you can customize the widget similar to the procedures in the section above.

Customize widget - Display recent posts on WordPress page

You can use the Grid icon to change the layout of the widget, choose to display featured images, etc.

Widget layout

After making your changes, click on the Update button.

Using Widgets – Classic Widget Editor

If you are using the legacy classic widget editor, then follow the steps below to add the recent posts widget on your WordPress website.

To start, go to Appearance >> Widgets and then locate the Recent Posts widget.

Recent posts widget

Next, click on the widget and select the placement you want. In this example, we chose the sidebar section.

Sidebar section

After that, click on the Add Widget button to effect your changes. Additionally, you can add a title to the widget, or increase/reduce the number of posts to display.

Add widget

Click on the Save button after updating the widget’s settings.

With this, you have successfully added the recent post widget to your website. The downside to using this option is that you do not get a lot of flexibility and control over the design and functionality of your widget.

Fortunately, with WordPress’s recent posts plugins, you can customize every aspect of your widget.

Using WordPress Recent Posts Plugins

WordPress plugins extend the functionality of WordPress websites. There are many plugins available in the WordPress plugin’s directory that let you add this feature.

Plugins such as content views, display post shortcode, and recent posts widget extended plugin provide this feature out of the box.

For this guide, we will use the Content Views plugin to easily display recent posts on WordPress pages. The plugin is free to use and provides a lot of control and customization options.

For instance, you can display your recent posts widgets with thumbnails or filter posts by category and tags.

Content Views Plugin

To get started, you need to install and activate Content Views plugins from your WordPress dashboard. Please check this guide to learn how to install WordPress plugins.

After activating the plugin, go to Content Views to open the plugins’ settings page.

Content Views Settings page

To add a new view, click on the Add New button.

On the “Edit View” page, add the title of the view you are creating. Under the “Filter Settings” tab, you can choose the post type and filter parameters.

Edit View page

By default, the plugin displays the 10 most recent posts. Therefore, you can work with the defaults provided by the plugin.

Meanwhile, on the “Advance” tab, you can use taxonomies such as categories and tags to filter the output of the post view.

Once done, click on the Save button to update the settings.

Under the “Display Settings” tab, you can customize the look and feel of the widget.

Display settings tab

In the “Layout” section, you can choose any of the display options. To preview your widget, click on the Show Preview button.

Layout section

Once you are satisfied with the preview, you can copy the shortcode the plugin generates for you and add it to any page or section of your website.

Copy generated Shortcode

How to Use Content Views on Pages and Posts

To use this shortcode, edit an existing page or create a new page. For this, go to Pages >> Add New.

Add new page - WordPress recent posts

On the page editor, click on the Add Block icon and then select the Shortcode block. After that, paste the shortcode you copied from the content views settings page.

Shortcode block

Next, click on the Publish button to save your changes.

You can preview the page to see how the recent post settings look on your website.

Recent post test

This method of displaying recent blog posts on a WordPress page is easy to set up and offers a lot of customizations to control the look and feel of your widgets.

Manually Display Recent Posts in WordPress Using Functions

If you do not want to install a plugin for the simple task of displaying the posts on your site, you can manually add a function to handle it.

This method is ideal for WordPress developers. So if you are not tech-savvy, we recommend using any of the methods above.

Before proceeding, we advise setting this up on your child theme. That way, you retain any customization on your theme after updating the theme files.

Also, it is a good idea to backup your WordPress site before making any major changes. This lets you roll back changes if any error occurs during the process.

Here, we will use the get_posts() function to display the 5 most recent post content. To get started, copy and paste the following code snippets below into your theme file.

 

$args = array(

‘numberposts’ => 5,

‘post_type’ => ‘post,

);

 

$recent_posts = get_posts($args);

 

if( ! empty( $recent_posts ) ){

$output = '<ul>';

foreach ( $recent_posts as $p ){

$output .= '<li><a href="' . get_permalink( $p->ID ) . '">' 

. $p->post_title . '</a></li>';

}

$output .= '<ul>';

}

echo $output ?? '<strong>Sorry. There are no recent posts at this time!</strong>';

 

Ideally, this code should be added to the single.php or page.php file. You can create a custom template file in your theme for this specific purpose.

You can also add arguments to the array parameter if you want to filter posts a certain way (such as by popularity, custom post type or a specific category). Please check this guide to learn more about how the get posts function works.

Using this function, you can wrap the entire code block in a container div. Then use custom CSS to customize your recent post widget as you please.

Conclusion – WordPress Recent Posts

Displaying recent WordPress posts on your pages reduces bounce rate and boosts engagements.

We showed you how to do this using the default widget and block, a WordPress plugin, or manually creating a function to handle the task.

Although the default WordPress widget works well, it does not provide a lot of control and flexibility on how recent posts should be displayed.

Using WordPress recent posts plugins, however, you get to choose the filters and also specify how it should look on your pages.

And if you are tech-savvy, the manual option gives you complete control to display and format recent posts as you wish.

We hope you found this guide helpful. For more WordPress tutorials, please check our WP College.

 This post was written by FixRunner Team

The FixRunner team - an awesome combination of WordPress experts, and technically savvy content creators - are determined to give the WordPress Community a solution to every problem. This diverse team - spanning 3 continents, young and mature, ladies and gentlemen - work seamlessly to keep the wheels running on WordPress sites across the globe.

Last edited by: FixRunner Team