The Query Loop block is an advanced block that allows you to display posts based on specified parameters; like a PHP loop without the code. You can think of it as a more complex and powerful Latest Posts Block. With various block patterns integrated into the block setup, you can do things like create a portfolio or a page full of your favorite recipes.

  • WP 2.9.4 Deployment


    Most of our recent work continues to focus on accessibility, improving code quality and maintenance, but we do have an exciting new feature that we’d like to share with you. Introducing QR Codes We’ve gotten requests for guidance around creating QR Codes for promoting University […]

    Read More

  • New Features: QR Code Generator & Image Expand on Click


    Most of our recent work has been focused on accessibility, improving code quality and maintenance, but we do have a few exciting new features that we’d like to share with you: QR Code Generator: We’ve gotten requests for guidance around creating QR Codes for promoting […]

    Read More

  • WP 2.9.3 Deployment


    Today’s WordPress deployment again focused on accessibility, improving the code quality of our custom plugins as well as general maintenance. Download Media Items in a CSV If you spend much time in the WordPress Media Library, you may notice a new “Download CSV” button there. […]

    Read More

In order to add a Query Loop block, click on the add block button and select the Query Loop block. You can also type “/query loop” and hit enter in a new paragraph block to add one quickly.

Detailed instructions on adding blocks can be found here.


Block Configuration

After adding a Query Loop block, you’ll see various layout options in the form of block patterns to choose from. You can view all options either in a carousel format or a grid format. Each Query Loop block is made up of various nested blocks, like the Post Title block and Post Excerpt block. While you won’t be able to edit the content of these nested blocks, you can customize the appearance and layout.

How to choose a pattern

  1. Add a Query Loop block using your chosen method.
  2. From there, you’ll be presented with an option to either click through a carousel of options or to view all options in a grid. You can toggle which method you prefer at the top of the block.
  3. Select the option you want to use by using the “Choose” button when in the carousel view or by selecting the option you want when in grid view.

How to start blank

  1. Add a Query Loop block using your chosen method.
  2. Select the “Start Blank” option.
  3. From there, you’ll see four variations you can choose from. Select the one you want to use.

How to customize the appearance

There are numerous ways to customize the Query Loop block partially because it’s made up of nested blocks that you can rearrange, add to, and more. When you customize one block in the Query Loop block, the changes will apply to all blocks of the same type. While customizing this block, it might help to use the List View found in the top toolbar. Here are some ideas for customization to get you started:


Block Toolbar Options

Each block has its own block-specific controls that allow you to manipulate the block right in the editor.

The block toolbar for the Query Loop block has the following options:

Changing alignment

Display Settings

This option allows you to control the following:

List view (default)

Displays your post in a stacked list.

Grid view

Displays your posts in a grid view.


Query Loop Settings

Every block has specific options in the editor sidebar in addition to the options found in the block toolbar. If you do not see the sidebar, simply click the ‘cog’ icon next to the Publish button.

Color

The color options for the Query Loop block impact the entire Query. Keep in mind that you can also customize the individual blocks that are within the Query Loop block too.

Inherit query from template

This is an option that you can toggle on and off, depending on whether you want to customize the query that the loop relies upon. WordPress will otherwise rely on the template being used to determine what posts appear. If you toggle it on, certain customization options will be hidden. If you toggle it off, more customization options will appear.

Order by

Sticky posts

This option allows you to choose between three options:

Filters

This option allows you to customize further what posts are being displayed. If you don’t see this section, it’s because you need to toggle off the “Inherit query from template” setting.


Advanced Settings

The advanced tab lets you add a CSS class to your block, allowing you to write custom CSS and style the block as you see fit. It also allows you to assign an HTML element.