Want to display blog posts, pages, or custom post types in a styled grid on your WordPress site? The Post Grid block in aThemes Blocks lets you filter content by taxonomy, pick from four layout presets, and toggle elements like featured image, excerpt, author, and Read More button from inside the Gutenberg editor.
In this guide, we’ll walk you through how to enable, configure, and style the Post Grid block with aThemes Blocks.
Before you get started, make sure you’ve installed and activated the aThemes Blocks plugin on your WordPress site.
Enabling the Post Grid Block
First, enable the Post Grid block from the Blocks Dashboard. Once enabled, open any page or post and add the Post Grid block from the block inserter.
Configuring General Settings
With the Post Grid block selected, open the General tab in the settings sidebar.
Presets
Choose from four different layout options.
Query Settings
- Post Type – Select Posts, Pages, or any custom post type.
- Taxonomy and Terms – Filter by specific categories or tags.
- Posts Per Page – Set how many posts display at once.
- Sticky Posts – Include or exclude sticky posts.
- Exclude Current Post – Skip the currently viewed post.
- Offset Starting Point – Skip a number of posts from the start.
- Order By and Order – Sort by date, title, ascending, or descending.
Carousel and Pagination
Enable or disable the carousel feature, and enable or disable pagination.
Image
- Show or hide the featured image.
- Set the image size, aspect ratio, and position.
Content
Display or hide the title (with selectable title tag), author, date, comments, taxonomy, meta icon, and excerpt (with customizable excerpt length).
Button
- Show or hide a Read More button.
- Choose whether the button opens in a new tab.
Styling the Post Grid Block
Switch to the Style tab to customize each element:
Layout
Set the number of columns, adjust column gap and row gap, set the background color, choose a border style, control vertical and horizontal alignment, adjust card padding, and decide whether to apply padding to content only.
Image
Set the border radius, add overlay effects, and adjust the bottom spacing.
Title, Meta, and Excerpt
Customize color, typography, and bottom spacing for each. Meta also supports separate meta text color and icon color.
Button
Set text color, typography, background color, button style, padding, and bottom spacing.
Configuring Advanced Settings
- Layout – Adjust padding, margin, and Z-index.
- Background – Set a background color for the entire block.
- Animation – Apply entrance animations like slide in, fade in, zoom in, rotate in, or flip in.
- Responsive – Hide the block on desktop, tablet, or mobile.
- Advanced – Add custom CSS classes or CSS IDs for further styling.
Frequently Asked Questions
Below, we’ve answered some of the most common questions about the Post Grid block.
Can I use the Post Grid block with custom post types?
Yes. In the Query Settings, select any registered custom post type under Post Type and the block will display items from that CPT.
How do I limit the grid to a specific category?
In Query Settings, choose a taxonomy and then select specific terms to filter the grid by category or tag.
Can I show the grid as a carousel instead?
Yes. Enable the carousel option in the General tab to switch the layout from a standard grid to a swipeable carousel.
That’s it! You’ve successfully built a custom post grid on your WordPress site using the aThemes Blocks Post Grid block.
Next, would you like to display categories and tags in a similar grid layout? Check out our guide on Using the Taxonomy Grid Block to learn more.
