isotropic-2022
Share
Blog
Search
Menu

Bricks Builder Loop Builder Tutorial - Build Dynamic Websites

By James LePage
 on January 13, 2022

Bricks Builder Loop Builder Tutorial - Build Dynamic Websites

By James LePage
 on January 13, 2022

One of the most requested features for Bricks, the Query/Loop Builder was added in version 1.3.7. In this tutorial, we'll show you how to used this powerful new tool to create completely dynamic websites with this page builder.

In WordPress, you can query content and build custom loops; Bricks now offers users a visual way to leverage this powerful tool to display content dynamically throughout the site. For example, if you have a "blog post" content type on your website, and want to display the 4 most recent posts (featured image, permalinked title, excerpt and a read more button for each of the 4 posts) for the "Cars" category, you'd use a custom query and loop builder to do this.

The Bricks Builder Query Loop builder is available for the Container, Accordion, and Slider elements.

Video Tutorial

Watch on IsotropicTV

Bricks Query Builder - How To Use

The query builder will pull in three unique styles of content. The first is any post type available to WordPress. This could be a blog post, but you could also extend this feature by adding custom post types to your website, and carrying those. For example, if you run a real estate website, you can add a custom pose type of house, and pull in all available houses.

screen-shot-2022-01-13-at-2-13-13-pm

The second is any term available to WordPress. By the fall, you have categories and tags for blog posts. But, with custom posts, you can add custom taxonomies, allowing you to further filter. While you can use these filters in the general post query, you can also display the actual categories. This is great because you can display all product categories, with associated images, repeated on your Bricks website.

screen-shot-2022-01-13-at-2-14-08-pm

Finally, you can pull in any user on the WordPress site, filtered by role. This is a great way to display authors on your website, or otherwise build a user directory.

You'll notice that there is a robust collection of filtering options. This will filter down your posts or items. For example, if you have 500 custom house types, but only 100 categorized as under 1000 ft.², you can choose that individual category, and the front and will only display custom House posts with in that category.

You can also combine multiple tags, categories, and custom taxonomy's. These filtering options are also available for your terms and user queries.

screen-shot-2022-01-13-at-2-10-21-pm
you can filter through large amounts of continent by using the taxonomy query or the meta query.

The Meta Query is especially powerful because you can really filter interspecific posts by utilizing a custom fields framework such as Meta Box.

The behavior of the Loop builder is to apply to a specific container. This container will then repeat for as many posts as you have queried. You can limit the number of repeating posts by incorporating a pagnation element. You can insert this element anywhere on the page, and applied to which ever loop you've made.

screen-shot-2022-01-13-at-2-11-23-pm

A tip that we covered in our video tutorial is to utilize multiple quarry loops, alongside offsets. An offset allows you skip a specific number of WordPress posts before starting the output. It's worth noting, this is just a GUI for the standard WP_Query, and there's a ton of official documentation that also pertains to this new feature.

https://codex.wordpress.org/Making_Custom_Queries_using_Offset_and_Pagination

The Bricks Builder Loop Query Builder is a powerful, yet simply presented interface for you to dynamically display content on any page, template or post in your WordPress website built with this new page builder. It's one of the last features that people have been waiting for to completely adapt this tool as the go to. It's a well-designed integration that allows both developers and beginners alike to make use of the WP_query, terms query and even user query. The fact that you can display these three types of contents on the front end of your website search this tool apart from other page builders on the market.

codewp-ai-og-new
Meet CodeWP, an AI Code Generator
Prompt CodeWP in plain English and it'll output high quality code, specific for WordPress.
isogroup-cover
Join The IsoGroup
A vibrant Facebook Group to talk about web design and the business of agency. Daily curated resources and conversations.
Join Now
bricks-builder-course
Bricks Builder Course - Coming Soon
The Bricks Builder Mastery course will bring you up to speed on this popular builder.
Get Launch Notification & Discount
Bricks Builder
Bricks is a brand new WordPress visual builder that's well designed, quick to use, and rapidly evolving into a tool for beginners and pros alike.
Learn More
We may earn a commission if you make a purchase, at no additional cost to you.
Disclaimer
Spotlight Product
Subscribe & Share
If you liked this content, subscribe for our monthly roundup of WordPress news, website inspiration, exclusive deals and interesting articles.
Unsubscribe at any time. We do not spam and will never sell or share your email.
Subscribe
Notify of
guest
1 Comment
Oldest
Newest Most Voted
Inline Feedbacks
View all comments
John
John
1 year ago

Great stuff!
If we have posts with taxonomies. There are advanced custom fields in taxonomies.

We use query to show posts, but how we can show advanced custom fields of taxonomies here?

For example:
Query post: Name of film; Description; Category; Description of category; advanced custom fields.

Article By
James LePage
Contributors/Editors
notloggedin
James LePage is the founder of Isotropic, a WordPress education company and digital agency. He is also the founder of CodeWP.ai, a venture backed startup bringing AI to WordPress creators.
We're looking for new authors. Explore Isotropic Jobs.
linkedin facebook pinterest youtube rss twitter instagram facebook-blank rss-blank linkedin-blank pinterest youtube twitter instagram