Are you a WordPress blog or site owner and want to create a custom homepage with category wise posts, then this post is for you.
Category wise recent posts in grid layout gives a professional homepage look to WordPress blog.
Following are some queries by site owners: Show category posts on wordpress homepage, Show recent posts from specific category, Category wise recent post in grid layout with title and thumbnail and Recent posts from specific category.
Now, if you are also searching for the above queries, then the following is the answer of your all queries.
WordPress users can display category wise recent posts in Grid/List view layout using the “Latest Posts” block in WordPress Gutenberg editor. Latest Posts block have content, featured image, sorting and filtering setting options, which helps to create category wise post listing.
“Latest Posts” Block is a built-in feature with WordPress Gutenberg editor. So, you can create category wise posts listing without any plugins or shortcodes.
Steps to display category wise recent posts in WordPress blog homepage
Following are steps to create a custom WordPress homepage with category wise latest posts listing.
1. Create new page from WordPress dashboard
WordPress has a customization feature to set a static page as a website homepage.
So, to use this static homepage feature, you need to create a page from “Dashboard > Pages > Add New” option.
And, the name of the page can be “Home”, “Static Homepage” or other name as per your requirement. This name is used to identify your page from pages list in admin.
2. Set page layout and disable page title element
Next, you need to change page layout settings to give the homepage full width. For that from the page right sidebar settings, do the following changes.
Set “No sidebar” for Sidebar layout setting, and for Disable Elements setting tick “Content Title” checkbox to hide page title name.
3. Add H2 (Heading 2) block with category name in page
Now, start adding blog category name and category posts list in grid layout.
To do that go to the page content area in the editor and add the H2 (Heading 2) block from the editor block list.
Set category name in H2 tag and add link this text to category listing page.
4. Add “Latest Posts” block and make settings for category posts
Next, add “Latest Posts” block after H2 block. Latest Post block is built-in and available in editor blocks.
Default this block displays the latest posts. So, here you need to add a category filter from block setting, to display specific category posts.
To do that, go to “Latest Posts” block’s “Sorting and filtering” setting and type category name in Categories input. Here, when you select a category from auto suggest, the editor block shows that category posts in page content.
At last, set grid layout for “Latest Posts” layout and set “Number of items” setting value 6. Now, your block is ready to display category posts.
5. Repeat steps-3 and step-4 to add more categories posts sections
Now, you successfully added one selected category posts listing in the homepage. In the next step, you need to repeat step-3 and step-4 to add more category posts section in page.
6. Set new create page as blog’s static homepage
In the last step, you need to set a newly created homepage as your blog’s static home page.
To do this, open the Homepage settings option from “Appearance > Customize > Homepage Settings”.
Here, set “Your homepage displays” = “A static page” and select the newly created page from “Homepage” select box.
Now publish changes, and test the homepage by visiting your blog’s homepage url in the browser.
Latest posts block setting options guide
Following are available setting options for WordPress Gutenberg editor’s “Latest Posts” block.
Post content settings: This section has options to hide/show post content, author name and date.
Featured image settings: This section has options to manage post featured image size, dimensions, alignment and image linking.
Sorting and filtering: This section has options to order posts list, filter posts by categories, posts by author, number of posts and grid columns.
Advanced: This section has the option to add additional CSS classes for block.
At Last,
To make your blog’s homepage more professional, the above guide is a simple and quick option.
Gutenberg Latest Posts block is free and easy to use option to create category wise recent posts listing in WordPress homepage.