How to use the query loop: You can display a query loop either as Vertical List or as a Grid. <\/p>\n\n\n\n
Query loop as a Grid <\/p>\n\n\n\n
\n
Select the Post<\/strong> Template<\/strong> and choose “grid” <\/li>\n\n\n\n
Select the Grid <\/strong>in list<\/strong> view<\/strong> > style > choose minimum Height 100%: Now every grid-box that contains a post entry will span the full height of its container (if you set a background color to the grid, you will see that the background fills the whole grid) \n
\n
<\/li>\n\n\n\n
Set Grid item Position to Auto. If you set it to manual choose Columns 1. <\/li>\n<\/ul>\n<\/li>\n\n\n\n
Optional: Add a stack inside the Grid (so grid is parent): Then place Title, Featured image and Date inside stack. \n
\n
Now set stack Justification to “Stretch items ” It makes all child blocks inside the Stack stretch to the full available width<\/strong> of the container. Optionally you could also choose “center” <\/li>\n\n\n\n
Set orientation: Vertical <\/li>\n\n\n\n
<\/li>\n\n\n\n
<\/li>\n<\/ul>\n<\/li>\n\n\n\n
Below I’ve created a border around the Grid (outer border) and the Stack (inner border): Here is the list view Structure<\/li>\n\n\n\n
Center the text <\/li>\n\n\n\n
<\/li>\n<\/ol>\n\n\n\n<\/figure>\n\n\n\n
This is how the Query loop result will look on your page <\/p>\n\n\n\n
![\"\"](\"https:\/\/brugbarviden.dk\/wp-content\/uploads\/2025\/05\/min-height.jpg\")
<\/li>\n\n\n\n![\"Stack](\"https:\/\/brugbarviden.dk\/wp-content\/uploads\/2025\/05\/stack-layout.jpg\")
![\"Grid](\"https:\/\/brugbarviden.dk\/wp-content\/uploads\/2025\/05\/grid-item-possition.jpg\")
<\/li>\n\n\n\n![\"query](\"https:\/\/brugbarviden.dk\/wp-content\/uploads\/2025\/05\/query-loop.jpg\")
<\/figure>\n\n\n\n![\"WordPress](\"https:\/\/brugbarviden.dk\/wp-content\/uploads\/2025\/06\/wordpress-template-hierarchy.jpg\")
<\/a><\/figure>\n\n