These photos/images are presented by cover image block sourced from a post featured image retrieved with a query loop of a sequence of posts that contain single single photo.
Columns block is used for layout, with two query loop, one per column. Where second query loop has post offset configured to 5 in order to skip those first 5 posts in left column.
For test purpose of responsive layout I configured post templates with grid layout set to auto mode with in each query loop. But with different “minimum column width” properties values.
In result on mobile everything appears equal form a “mobile first” approach. Same is for tablet devices, where I was hopping to fit more elements in a row.
Where on desktop the differences in “minimum columns widths” are visible, as the parent columns block “align” property is configured to “wide”. Thus, allowing the first column to render images as larger
These experiments tell about differences in handling responsive layout/design and/or media query in different blocks.
Further, cover images blocks allow the post content or excerpts to be placed inside cover images blocks.
I see that useful as it is still consistent with core WordPress navigation functionality.
Leave a Reply