(This tutorial is a modified version of Brad Dalton’s Add Latest Posts With Pagination To Front Page With Widgets Where he has provided the front-page.php code for News Pro Child Theme. Please do refer to his article to understand this code.)
Most StudioPress themes include a front-page file which normally includes widgets.
If you also want to include your latest posts dynamically, you can enable the standard loop before or after the widget areas.
Another option is to add a custom grid loop that also enables you to display your posts in a grid type layout or simply as features that are like the standard loop archive.
The only problem is, it may not generate pagination.
In this tutorial, I will show you how to Add Latest Posts with Pagination to Front Page with widgets on Magazine Pro Genesis Child Theme.
I will provide the entire front-page.php template which includes all the code tested on the Magazine Pro Genesis Child Theme. You can modify the classes to fit in with your existing themes classes.
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:
- It wouldn’t include pagination
- 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:
- Only your front page includes the widgets
- 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.
Screenshots
Confused? Here’s what the front page & paginated pages look like after adding the code.
And here’s what the 2nd and subsequent paginated pages look like without the home page widgets.
If you enjoyed this article, you can also read Easy Steps to Start a WordPress Blog and Make Money.
Related Tutorials
Here is a simpler solution I used to add pagination to Magazine Pro:
1. Create a new page with the title Next. The slug should be next.
2. Under settings – reading, set the Posts page to Next
2. Edit your home page with the block page editor. At the very end, add a paragraph with just this text: More Stories. Add a link to the More Stories text to yourhomepage/next/page/2
3. That’s it. The end of your page will have a “More Stories” paragraph which when clicked will take the reader to page 2. From there, the pagination is provided by wordpress.
Thanks you for explaining this method as well. Cheers đŸ™‚
Hi,
Added this code in frontpage,php
remove_action( 'genesis_loop', 'genesis_do_loop' );
add_action( 'genesis_loop', 'custom_grid_loop' );
function custom_grid_loop() {
if ( is_home() && function_exists( 'genesis_grid_loop' ) ) {
genesis_grid_loop( array(
'features' => 0,
'feature_image_size' => 'home-top',
'feature_image_class' => 'aligncenter post-image',
'feature_content_limit' => 0,
'grid_image_size' => 'home-middle',
'grid_content_limit' => 250,
'more' => __( 'Read more', 'magazine' ),
'posts_per_page' => 5,
) );
} else {
genesis_standard_loop();
}
}
Now pagination is showing up, but the problem is when I open 2nd page all the widgets are showing there also.
Is there any way to hide widgets on 2nd page?
P.S: I'm not using Magazine Pro theme.
Nice tutorial Suresh and thanks for the credit!
Hi Brad,
You are doing very good job at your blog by teaching people and providing tutorials about Genesis. I need one favor from you. I am enable to open your website here at india this is my IP address
125.99.108.162.
It is giving me an error of
Sorry but this content is not available in your country at the moment.
can you please tell me why it is happenning.
Keep doing the great work.
Thanks & Regards,
Suresh Patel
Suresh
Please send me an email and i will explain.
I copied the code to my magazine pro theme and like it but If I want to keep the Section Titles ( the black title bar for top middle and bottom widget) How would I do that?
Hi Kelly good to here you like the code.
You can add the title in the genesis featured widget and it will appear as on the home page đŸ™‚
Thanks for the tutorial however, i was unable to control the numbers of post displayed….
I think there’s something wrong here – this solution shows the first 6 posts twice. Is there a way to offset the posts that come after the widgets?
I checked Brad and yours update, however I have 2 questions for you.
1. I am also using the Magazine Child theme but not the latest upgrade Magazine Pro, will the code still work?
2. On my Magazine Child theme, I don’t have front-page.php but I have there the default page_landing php. Should I update it with the code above or I have to create front-page.php?
Thanks
Hi Arsie,
Thanks for checking this tutorial but sorry to tell you that i have not used magazine child theme, so not able to tell you whether this code will work for magazine child theme.
But you can try pasting this code to page_landing php fill on your local environment and see whether it is working or not.
I might try to do that.. or I might update with the latest magazine pro theme.