The Query Loop block allows users to visually design layouts that display dynamic content from the website, like blog posts, custom post types and also pages. GutenKit has brought such a Query Builder block with extended capabilities.

Let’s see how the block works.

GutenKit Query Builder #

From your WordPress dashboard open the page/post where you want to use the Query Builder.

Now search and simply click/drag and drop the GutenKit Query Builder block.

Choose a pre define blank template for the query loop from the variations.

Customizing a template #

In a Query Loop template, you can edit image, excerpt, title, date, add more content, and so on.

Editing featured image #

Under the Content part, you’ll see –

There are options to adjust Image Size, Alignment, and Caption. Also you can put Link to the image.

The Link options are –

• Link To Post – If you select this option, you can also check mark Open in new tab and No follow boxes for the link.
• Custom URL – Here you can insert your preferred URL.
• Media File – For this option you can Enable Lightbox option.

In the Style tab, there are options to change Aspect Ratio, Width, Height, Add Overlay, CSS Filters, Border, Box Shadow.

Editing post title #

• Post Title Before – Lets you add custom text that appears before the actual post title.
• Post Title After – Lets you add custom text that appears after the actual post title.
• Post Title Fallback: Provides a default title to display if the post itself has no title.
• Title Link: Controls whether the title is clickable and if so, where it links to (usually the full post).
• Title HTML Tag: Allows you to choose the type of HTML heading tag (H1, H2, etc.) used for the title, affecting its visual importance.
• Post Title Length: Sets a maximum character limit for the post title, ensuring it doesn’t become too long.

To style the title based on your choices, you can change text color, background color, typography, etc.

Here, the function of the Blend Mode is to create cool effects by selecting blended styles from the list.

Editing post excerpt #

Under the settings section, you can change the Excerpt Length based on your preferences and set Fallback.

The style part lets you change the Alignment, Color, and Typography of the excerpt.

Editing post info #

In the content part, you can update the Metadata.

Layout – You can set the layout as Default or Block. However, you will get the options to edit Author, Date, Time, Comments, Terms, and Custom.

• Author – After expanding the option, you’ll edit Type, Link, Shadow avatar, Before text, and Icon.
• Date – Here you can change the Date Format, Link, Before Text, and Icon.
• Time – It lets you adjust Time Format and the similar things as the Date.
• Comments – To arrange the comments, you can enable the Link button, write Before Text, and set an Icon.
• Terms – Here, the terms are Categories and Tags. There is a bar that lets you add as many terms as you wish.
• Custom – Here you’ll have a field to add Custom Meta Label based on your wish. Moreover, the other customization options are the same as before.

#

Editing pagination #

• Pagination Type: The types are –
  • Number – Here, you can adjust Truncate Pagination Numbers. It helps to hide some page controls, showing only the first/last few and current page for easier navigation.
  • Previous/Next – With this option, you can adjust the previous and next text and icon to style the pagination.
  • Number + Previous/Next –
• Previous / Next Type: Text, Icon, Icon & Text

Advanced #

There is an Advanced section in the block. Here, you can use ADDITIONAL CSS CLASS(ES) to arrange the block based on your preferences and set BLOCK NAME.