Bricks Tutorials List

Filtering for In Stock or Out of Stock WooCommerce products using Bricks' filters currently only works at the product level and not variation level. This will soon be officially supported as can be seen here in the Roadmap. If you can not wait for Bricks to make this available and your shop needs this feature…

If you ever wanted to not render header and footer on the WooCommerce My Account page but output them for endpoints like /my-account/orders this tutorial is for you.

A must-use plugin for WordPress that helps you quickly select your city in the general settings for timezone.

Learn how to change the keyboard shortcuts for viewing on front end from Ctrl/Command + Shift + V to Ctrl/Command + Alt + V using custom JavaScript.

Learn how to collapse all items of Bricks nestable accordions at a specific breakpoint.

Learn how to link to a specific heading inside a Tabs (Nestable) element's tab pane content using custom JavaScript.

In the Bricks Facebook group, a user asks: Hey Everyone,I am trying to create the following:1- I have a Custom Post Type2- I have a static page, and in the URL, I am displaying a URL parameter that contains the ID of the custom post type.I want to display dynamic data (i.e. post title) on…

Learn how to show top-level parent categories as tab titles and the corresponding subcategories as tab contents using Bricks nested queries.

Learn how to make WP Grid Builder's Load More facet work with Bricks' ACF Repeater query loop.

Learn how to insert common elements in Bricks builder editor easily with single key presses. Also, a handy hotkey to toggle the hover state for the selected element.

Learn how to add a custom class to all the images rendered by Bricks' Gallery elements so these images can be excluded from Perfmatters' Lazy Loading of images

Learn how to set up nested query loops in Bricks to show hierarchical posts with child posts grouped under their corresponding parent posts

How to insert an image or any Bricks element between posts output by a query loop.

Detailed instructions on setting up Bricks' Map element with additional location-based distance filtering or proximity search input.

How to link a Bricks post-creation form on a post to a newly created post of another post type using Meta Box relationship.

Updated version of the earlier Upcoming Events Grouped by ‘Month Year’ in Bricks tutorial with some improvements:

In the Bricks Facebook group a user asks: We can use AI to help unfreeze our brains sometimes or at least have it write the code with us after giving directions on the logic 😅. Here's the PHP query for this:

How to set the source of Bricks’ Image Gallery element on a post to images in the selected HappyFiles Folder(s) via a Meta Box Taxonomy or Taxonomy field.

Implement FullCalendar in WP using the WordPress REST API. Showing events on a calendar with event data (incl. custom field values) in popovers.

Update: Also added Variation 2 with support for Bricks' Load more functionality. In the Bricks Facebook group a user asked: Hello everyone. I have this issue with filtering and bi-directional relationships between 2 CPTs. I have made a query loop with the CPT "Sample packs" and need the CPT "Artists" post title in it. So…

We explore adding conditional classes or data attributes to Bricks query loop items.

How we can use PHP query feature in Bricks to get the value (post ID) of a Post-type Meta Box custom field

Programatically sync separate date and time custom fields & other useful customizations to the popular Pie Calendar plugin.

We look into how ACF Repeater rows output by a Bricks query loop can be filtered using the bricks/query/run PHP filter.

Learn how we can pass post-specific values into a Gravity Form placed in a query loop, ensure the modal form resets properly after submission.

How we can use Bricks' render_tag() as a simpler way to limit the image count in any Gallery element.

A walk through on setting up a ACF Flexible Content field with a couple of different layouts.

How to set up Nestable tabs with post titles as the tab menu, and post content and/or any other post-specific data as the tab content.

In Bricks Reddit, a user asks: Let's break this down and set up the scenario practically. First, there's a Language taxonomy for posts (could be standard posts or a CPT posts) with these sample terms: Sample posts with languages assigned: Based on the graphic in the question, we are assuming that a post will have…

One way to set an image limit when outputting a Gallery in Bricks.

This tutorial explores different ways in which images from WordPress Media Library organized via HappyFiles can be pulled and shown in Bricks using query loop(s). Note that these are only needed when you want more control than what the 'HappyFiles - Gallery' Bricks element added by HappyFiles provides. HappyFiles folder images using nested query loops…

How to register a new dynamic tag for setting excerpt word limits and outputting an ellipsis (...) at the end.

Bricks lacks built-in dynamic tags for ACF field labels, prefixes, and suffixes. This tutorial shows how to add them using custom dynamic tags.

The steps for animating the posts output by a Bricks query loop in a staggered animation.

In the Bricks' Facebook group, a user asked: Meta query? What am I missing?Hi all, really need a little guidance on this one. I have a CPT called tradeshows, set up with ACPT. I have a loop showing them, but I would like to have the ones that the "End Date" has passed the current…

A user asked: I have a CTA in the footer of my site, which I have custom fields on various templates, etc to populate. I don’t want it on a custom taxonomy archive (service-types), but I can’t for the life of me see how to hide that section on those alone. CPT: serviceCustom Taxonomy: service-type…

The steps to display posts from any WordPress site that has WP REST API enabled in Bricks builder using a custom query type.

Creating a custom query loop for WooCommerce product reviews for building custom review layouts.

This Pro tutorial provides the steps for showing posts from any WordPress site using the WordPress REST API. For this to work, the external (or can be the same) WordPress site must have the REST API enabled (it is, by default). We shall add HTML, PHP and CSS for this in a Code element. As…

Conditionally render elements in a single template of a CPT depending on the value of a regular custom field.