A WordPress Query Loop portfolio grid lists projects from your content and repeats one card design for each result. Instead of copying image-and-title groups whenever you finish a project, you publish a post and let the query decide whether it belongs in the grid.
This walkthrough uses ordinary posts assigned to a Projects category. It works with block themes in WordPress 6.6 and later, including 7.x, without requiring a custom portfolio post type. Work on a draft page first, and keep the existing portfolio page available until the new grid is checked.
Build a WordPress Query Loop portfolio grid
1. Prepare three project posts
Open Posts → Categories and create a category named Projects if you do not already have a suitable one. Then open Posts → Add New Post. Give the first project a descriptive title, add the case study content, and assign the Projects category in the post settings.
Set a Featured image for each project. The grid’s Featured Image block uses this setting; it does not automatically select the first image in the article. Add a short Excerpt if you want a controlled introduction on each card.
Prepare at least three posts with different title lengths and image orientations. Publish them when the content is ready to be public. An editor’s draft preview is not proof that signed-out visitors can see the same posts.
2. Choose where the grid belongs
For a standalone portfolio page, open Pages → Add New Page, give it a title such as Work, and keep it as a draft while designing. This keeps your first attempt separate from templates that may affect many routes.
If your theme already supplies a work index, inspect that first. Daybreak has a contact-sheet Work page with adjustable Query Loop columns. Monograph uses posts in its selected-work Query Loop and includes a separate Work index template.
To edit an existing template, use Appearance → Editor → Templates and select the template actually assigned to the page. Do not change the archive or search query merely to make one portfolio page look right; those routes serve different purposes.
3. Insert the Query Loop block
Use the block inserter, search for Query Loop, and insert it into the page. Choose an offered pattern or select Start blank when available. A simple image-and-title layout is a useful starting point because it is easy to inspect.
Open List View. Find the outer Query Loop and the nested Post Template. The outer block chooses the posts; Post Template contains the card structure repeated for each result. Pagination and No Results content sit outside the repeated card.
Select the outer Query Loop before adjusting filters. Clicking an image in the canvas selects the image, so the sidebar may show image controls instead of the query settings you need.
4. Set a custom query for Projects
In newer WordPress versions, set Query type to Custom in the Query Loop settings. In WordPress 6.6, turn off Inherit query from template when that control is present. This lets the Work page choose its own set of posts.
Set Post type to Posts. Under Filters, add the category filter and choose Projects. Newer interfaces group category controls under Taxonomies; older interfaces may show Categories directly. Choose a date or alphabetical order that makes sense for your work.
Set the number of items to a modest starting value, such as six. Leave Offset at zero if you intend to use ordinary pagination. Check that a blog post without the Projects category stays out of the preview; this is a useful test of the filter.
5. Design the repeated card
In List View, select Post Template and use its Grid layout control. Start with two or three columns where the available controls allow it. The comfortable count depends on the page width and the amount of text in each card.
Inside Post Template, keep Featured Image and Post Title. Add Post Excerpt only if the summary helps someone choose a project. Remove dates or author details if they do not help explain the work, but preserve useful context in the case study itself.
Enable Link to post for the title and, if appropriate, the featured image. Choose an image aspect ratio intentionally. Cropping can make the overview orderly, but it should not remove the object or architectural detail that identifies the project.
6. Add navigation and an empty state
Keep or insert Query Pagination inside Query Loop, after Post Template. Include the pagination controls you need, such as previous and next links and page numbers. These should appear once beneath the collection, not inside every project card.
Add a No Results block with a brief message for an empty query. During setup, that message can also reveal a category mistake. Do not use it to claim that a project archive exists when no matching posts have been published.
Test pagination with more matching projects than the items-per-page limit. If you only have three real projects, reduce the limit temporarily to two, test the next page, and then restore the intended count.
7. Save and test the reader’s route
Save the draft and preview it at a narrow width. Read the longest title, check the crop on each image, and follow both image and title links. Make sure the destination contains the intended project rather than a media attachment page.
Publish when the page is ready. If needed, add it to the site’s Navigation block through Appearance → Editor; open the header containing that block and add a link to the published Work page. Save the navigation change and confirm it on the public site.
Open the page while signed out and test pagination again. Add one later project through the same post workflow to confirm that the grid updates without manually copying or rearranging cards.
Common problems
The grid shows blog posts
Select the outer Query Loop, verify its custom query setting, and check the Projects category filter. Also confirm that unrelated posts have not accidentally received that category.
Every card has the same photograph
You may have inserted a regular Image block inside Post Template. Replace it with Featured Image so each card draws from its own post, then confirm that each project has a featured image assigned.
The column controls seem to be missing
Select Post Template in List View rather than Query Loop or an individual card block. Layout controls differ by version and theme, so inspect the selected block before adding custom CSS.
FAQ
Does a WordPress Query Loop portfolio grid require a plugin?
Not for this posts-and-category approach. A separate portfolio content type would need its own registration and suitable editor support, but ordinary project posts are enough for the workflow above.
Summary
Store projects as posts, filter the query by category, and design one repeated card in Post Template. Verify image links, mobile titles, pagination, and a newly published project before treating the index as finished.
For existing project-index approaches, explore WordPress portfolio themes.