One of the holy grails of blocks, as far as I am concern, is post loops. To me, this is the essence of dynamic blocks and over time I have used several tags to keep track of the blocks I review that include this feature in some capacity, most notably:
Out of the three above I believe that it is paramount that any new “post loop” blocks include support for all registered CPTs and Custom Taxonomies on a given WordPress site.
The problem with “posts” blocks
The very ethos of Gutenberg is compatibility and stackability. This naturally translates into letting a user select any CPT or taxonomy the may be using on their site when using a post loop block.
I realize there is a plethora of shortcode based plugins in the repository which already offer this type of functionality but I am focusing on blocks specifically, not on WordPress in general, and I am only interested in blocks that do this.
There are many great post list plugins/blocks out there but very few of them meet this condition, most of them will only work with posts.
Up until today my go-to plugins for CPT listing were Custom Post Types Block and Guten Post Layout but they did not offer too many options in the way of query complexity or layout styles.
An -almost- perfect block
I came across Gutenberg Post Blocks a couple of weeks ago and I quite liked the completeness of the plugin but, as it nearly always happens, the block did not support CPTs. I added this comment:
Congratulations for putting out this plugin, it is the most comprehensive plugin to add post grids, lists and sliders I have found so far. I particularly like the fact that you included pagination, offset and filters. The amount of detail you put into certain details, like the post meta part, is almost insane!
I did notice a couple layout issues with horizontal overflowing and the editor crashing once, but I need to test these further before I can offer any feedback on that.
I do have a couple of suggestions to make it even better:
– Include an option to also query/filter posts by date or author.
– Enable the possibility to query other CPTs.
There are couple of plugins out there which already do the above. If you were to include these two features, specially the last one, your would totally kill it!
Thanks again, all the best!MrFoxTalbot – Gutenberg Post Blocks reviews
To my delight -and quite frankly also to my surprise- the plugin author replied a few days later saying they had updated the plugin to add CPT support.
Here goes my detailed review to, in my humble opinion, the most complete post listing Gutenberg block at the moment. Shout out to wpxpo for their responsiveness.
Gutenberg Post Blocks
Here are a couple quick videos from the plugin author’s YouTube channel to introduce the block.
The plugin introduces a number of new blocks, but most of them are variations of three types of Post Loops: Lists, Grids and a Carousel.
The first tab is the general settings one and allows us to easily show or hide most of the elements in the post (image, excerpt, meta) as well as the well as in the loop itself (heading, pagination, filters).
The Grid block introduces the choice for columns & gaps as well as an option to style separators.
The Slideshow block also has a few specific options such as autoplay, animations and arrow/dots display.
This is by far the most interesting feature in this block. The querying options are as thorough as they get but even then they are easy to understand even for a basic user.
- Select CPT
- Pick Taxonomies (combine multiple terms)
- Include/Exclude posts by IDs
- Offset (skip X posts)
- Order (several options)
- Pagination (ajax)
The only query criteria I am missing here would be the Author one and, if we were going to get picky, a date based filter (months, years, etc).
UPDATE: While writing this review I noticed that if you choose any CPT other than the regular posts, the taxonomy filter will not update to show taxonomies associated to that CPT, I have shared this feedback with the plugin author as this defect seriously limits the possibility of using the plugins with CPTs
Styling options are truly staggering, even to the point where I would argue it may be going a little bit too far, especially in the context of Global Styles being introduced very soon. As a front-end web developer, I will normally prefer to make this tweaking by adding my own CSS styles, which I realize is not everyone’s case.
There are all kinds of layout & typographic settings as well as separate mobile & hover options.
- Category Filters
- Display terms
- Post Meta
- Mobile styles
- Hover styles
- Images & Overlays
- Content Wrap
- Titles (heading level)
- Read More
The degree of details around post meta visibility and styling, to mention a specific example, is almost insane:
Beyond the default blocks, each of the blocks also offers a few pre-made layouts to choose from. These premade layouts work pretty well out of the box.
Bonus track: Advanced image block
This could be especially interesting, especially in combination with the new Rich Image Tools.
It has quite a few options when it comes to image overlays:
It was on my talk on Gutenberg at WordCamp Bilbao, nearly two years ago and well before Gutenberg was introduced in core, that I mentioned this quote on my presentation:
I work as a Happiness Engineer for WordPress.com helping newcomers set up their sites and this is something I see every day. This plugin’s degree of detail might be a little too much for the average WordPress.com user, but we must strive to make all these basic options (both for queries and layouts/styling) available to users.
We must make good, flexible blocks, not necessarily many or complex blocks.
At the same time, we should not miss the bigger picture by giving up the things that have made WordPress what it is. Let me explain what I mean by this:
When sharing this block with other members of the WordPress community I will sometimes hear comments to the effect of “with this plugin, we don’t need archive pages “.
I wholeheartedly understand where this feeling is coming from, and the fact that the plugin introduces pagination makes it even truer than ever, but I believe that simply adding blocks like the one discussed on this post to static pages and using them as a substitute for archive pages falls really sort and is a disfavor to ourselves and the WordPress users at large. Let us not do that.
The way to go would be to introduce “Archive pages” editing in Gutenberg, meaning styling the templates that the theme will use to show all category, author and date archives (ideally each of them separately).
This is something Elementor and Toolset have been capable of for a while now and that Gutenberg development should focus on introducing as the next thing.
Annex: Block Demos
Block demo: List
Here is one of the Post Lists Block in action, with a filter at the very top:
Another list style, with pagination at the top (instead of the filter).
Block demo: Grid
Here is on of the Grid Blocks in action:
Another Style (somethings is not quite right with these styles but this seems to be a conflict with my site, not a defect on the plugin itself).
Grid block, alternative design:
Grid block, another design:
Block demo: Slideshow
Here is the Slideshow Block in action:
3 replies on “Gutenberg Post Blocks”
Great write up, nice to see that the developer was so responsive. I’m going to give this plugin a shot!
Great… some one should tell you Great content
I love this plugin! Stumbled on it through YouTube. It makes the life of a new Wp user easy…. Thank you for your review!