Add Latest Posts With Pagination To Front Page With Widgets

Most StudioPress themes include a front page file which normally includes widgets.

If you also want to includes your latest posts dynamically, you can enable the standard loop before or after the widget area’s.

Another option is to add a custom grid loop which also enables you to display your posts in a grid type layout or simply as features which are like the standard loop archive.

The only problem is, it may not generate pagination.

In this tutorial, i’ll provide the entire front-page.php template which includes all the code tested on the News pro theme. You can modify the classes to fit in with your existing themes classes.

The template code has also been coded so it solves another important problem which we’ll discuss after you copy and paste this code:

Here it is:

If you simply added a custom loop or grid loop to our home or front page template file you would suffer these problems:

  1. It wouldn’t include pagination
  2. If it did include pagination, the 2nd and subsequent paginated pages will also include the widgets you have coded in your template file to display on every paginated page.

The code above includes the solutions to solve both problems so:

  1. Only your front page includes the widgets
  2. All paginated pages linked to your front page only display your standard loop like a posts page without widgets.

On top of this, you can also choose how you want your posts displayed:

  • In a grid loop, 2 excerpts side by side
  • The first post in full and the rest excerpts.
  • Full content width featured and then grid excerpts.

Screen Shots

Confused? Here’s what the the front page & paginated pages look like after adding the code.

front page

And here’s what the 2nd and subsequent paginated pages look like without the home page widgets.

paginated pages

Related Tutorials


Comments

14 responses to “Add Latest Posts With Pagination To Front Page With Widgets”

  1. Hi,

    I finally decided to try Genesis and were able to do most of things I need before I can go live.
    But pagination is the last thing I would like enable.
    Your tutorial is not working for me.

    I am thinking if there Is additional process I had to follow before pagination is enabled?
    I changed code in front page template, out of the the box pagination is not shown.

    If I use amplified widget where I can set pagination, numbers of pages show at the bottom, but when I click number 2, instead of opening page 2 with posts inside it opens blank page.

    Thanks for your help!

    1. Brad Dalton Avatar
      Brad Dalton

      Just realized you’re a member.

      Can you send me login details and I’ll take a look for you.

  2. The big problem to use featured widget amplified plugin is no ability to exclude posts.
    I have created widgetised homepage. And added latest posts in top widget, added some latest posts from category to home middle widget and below that all latest posts appear which are already shown by featured post amplified plugin so it looks like there goes ton of duplication of posts on homepage.
    So how do I solve this entire mess ?

    1. Brad Dalton Avatar
      Brad Dalton

      Exclude the ones in the widget from the main loop.

    2. Brad Dalton Avatar
      Brad Dalton

      Try the new Genesis Sandbox Featured Content Widget. It enables you to exclude previously featured posts from displaying in the widget.

  3. Suresh Patel Avatar
    Suresh Patel

    Hi Brad,

    Based on your code i have created front-page.php template for Magazine pro Child theme and publish an article on my website this is the link of the article http://pixel2pixeldesign.com/add-latest-posts-pagination-front-page-magazine-pro-genesis-child-theme-widgets/

    I thought i should share this link so that readers of your blog also get this for for their Magazine Pro Child theme.

  4. […] tutorial is a modify version of Brad Dalton’s Add Latest Posts With Pagination To Front Page With Widgets Where he has provided the […]

  5. sorry, same question as above.

  6. Is it possible to integrate this on magazin pro child theme frontpage ?
    right under all widgets ?

    1. Brad Dalton Avatar
      Brad Dalton

      Yes. All themes are coded differently so the code would probably need modifying.

  7. Hi Brad,

    Thanks for providing this useful snippet code for genesis.

    I am using metro pro theme your code work fine for Metro Pro theme, but genesis loop also shows top 3 featured post as well in the loop. Is there a way to remove featured post appearing in the widget that post i need to remove from genesis loop.

    Thanks in Advance.

    Regards,
    Suresh

    1. Brad Dalton Avatar
      Brad Dalton

      Try the Genesis Featured Widget Amplified plugin.

  8. Hi Brad

    Your blog is helpful to me at extreme level. I have used many of your snippets for my work. Thanks a lot.

    I am in need of exact same thing as described here but with “Magazine Pro” child theme. I tried to place your code but not getting the things right as I’m not expert with coding. Please help me what should I do.

    Regards
    Afsana

    1. Brad Dalton Avatar
      Brad Dalton

      Hello Afsana

      There would be a bit of tweaking involved to get it to work on other themes if you wanted to code the entire front-page.php file.

      What you could do is add the last part of the code from line 112 onwards into your front-page.php file.

Leave a Reply

Join 5000+ Followers

Get The Latest Free & Premium Tutorials Delivered The Second They’re Published.