Bricks Tutorials List
Search / filter list
Tutorial | Date | Quick View |
|---|---|---|
| McDonald’s Order Promise Analogy | 20th Mar '25 |  From the JavaScript course I am doing now: A Promise is like placing an order at a restaurant. You receive a ticket (Promise object) that indicates your order is being processed. The order can either be successfully delivered (resolved) or canceled (rejected), and you can attach actions (.then() and .catch()) to handle either outcome. I… View Tutorial → |
| Conditionally Rendering an Element Outside the Loop based on Taxonomy Term in Bricks | 14th Mar '25 | Pro  A user asks: Hiding element based on taxonomy I have an element in a footer that I want to hide if a page has a particular taxonomy value. Consider this scenario: Taxonomy key: page-type for page post type. A specific Page, say a Page titled "Sample Page" has the Page Type set to "No Ad".… View Tutorial → |
| [Notes] JavaScript Modules | 12th Mar '25 |  I recently began my journey to become a full-stack developer and am starting a series where I share my notes on what I've learned that day. This post on ES6 Modules is the first of many. Note: This topic will not be clear w/o knowing JS concepts like variables, functions, classes and objects. Intro ES6… View Tutorial → |
| Merging ACF Gallery Images with Featured Image in Bricks | 4th Mar '25 | Pro  Updated on 12 Mar 2025 In the Bricks Facebook group a user asks: Merging images from different fields into a single gallery Hi, I have a Gallery field created in ACF and a standard Featured Image field. Is it possible in Bricks to display images from both fields as a single gallery using dynamic data,… View Tutorial → |
| CMB2 Repeatable Group Bricks Query Loop | 3rd Mar '25 | Pro  This Pro tutorial provides the steps to create a custom query loop type for outputting the subfield values of a Group field (repeatable) when using CMB2, a free custom fields plugin for WordPress in Bricks. We shall add a Group field containing a Text field, URL text field and a File field (for the image)… View Tutorial → |
| Host Post’s Term in Bricks Query Loop | 3rd Mar '25 | Pro  Updated on 4 Mar 2025 In the BricksLabs Facebook group a user asked: Hi everyone, I’m facing a tricky situation that might have a simple solution, but I’m having a hard time wrapping my head around it. I would appreciate your assistance! How can I fetch dynamic data from 2 different CPTs while querying only… View Tutorial → |
| Filtering Bricks Query Loop By Meta Box Relationship | 28th Feb '25 | Pro  In the Bricks Facebook group a user asks: Consider this setup: CPTs: Service Areas and City Pages Meta Box Relationship: City Pages to Service Areas A Service Area post can have 0 or 1 or more City Page(s). Sample Service Area with some City Pages: Sample Service Area with no City Pages: The objective is… View Tutorial → |
| Filtering Meta Box Cloneable Group by Select Subfield for Multiple Bricks Query Loops with Conditional Output | 27th Feb '25 | Pro  In the Bricks Facebook group a user asks: Consider this cloneable Meta Box field group for a Custom Post Type called Tour: with the Tour Block Position select subfield having these options: A Tour post being edited: The Bricks single Tour CPT template: It contains a section for showing the post title and content, and… View Tutorial → |
| Sorting a Cloneable Meta Box Group by a Date Subfield in Bricks | 24th Feb '25 | Pro  In the past we showed how to order Meta Box group rows in Bricks by a text-type subfield here. This Pro tutorial covers the same, but for a Date Picker subfield. Consider this field group: and in the post editor of a sample Page: With the query type set to this Meta Box group in… View Tutorial → |
| Bricks Dynamic Condition – Check if today falls within 5 days before any holiday date | 20th Feb '25 | Pro  In the members-only Tutorial Requests section, a user asks Conditionally show a banner if date exists and is equal to today + 5 days before I would like to set up a banner for office closures based on holidays/ dates that I put into a meta box custom field ( would a repeater work?) I'd… View Tutorial → |
| Dynamic Google Map in Bricks – Markers from ACF Repeater Google Map Sub Field Values | 14th Feb '25 | Pro  This Pro tutorial provides the steps to show the addresses entered using a Google Map sub field of a ACF Repeater as markers on a Google map using Google Maps API in Bricks. ACF Field Group: Field being populated for a Page: After implementing the tutorial, when the Page is viewed on the frontend: When… View Tutorial → |
| Checking ‘PublishPress Future’ plugin’s Future Action enabled posts | 4th Feb '25 | Pro  PublishPress Future is a handy plugin for scheduling actions like unpublishing or deleting posts (of any post type) at a specified date and time in the future. It provides a handy [futureaction] shortcode that outputs the current single post's action date. If you are looking to conditionally output an element in Bricks depending on whether… View Tutorial → |
| Meta Box Relationship Posts Filtered by a Taxonomy Term in Bricks | 4th Feb '25 | Pro  Updated on 17 Feb 2025 In the Inner Circle a user asks: Hello, I have a relationship made in metabox between two Post Types “Travel” AND “Programs” When I am in post Type “Travel”, I want to query the relationship, so I only see the “Program” posts, filtered by a term=”long-travel” of a taxonomy “travel-types”I… View Tutorial → |
| ACF User Field Bricks PHP Query | 14th Dec '24 | Pro  In the Bricks Facebook group a user asks: my end goal was to create a set of cards that would display the Users that are in an ACF User field as a set of cards for my employee directories. This Pro tutorial provides the steps to set the Bricks query type to the built-in Users,… View Tutorial → |
| ACF Relationship: Count of Related Posts | 13th Dec '24 |  Looking to get the number of CPT B posts related to a CPT A post when using a Relationship field with ACF? Here's a custom function for that: bl_get_related_posts_count( 'related_cities' ), for example, can be used to output the number of cities for each country in a country query loop where related_cities is the Relationship… View Tutorial → |
| Filtering posts by a group field’s subfield value with Meta Box when using a custom table in Bricks | 11th Dec '24 | Pro  Filtering a query loop to output only those posts with the value of a Select subfield of a Group field set to Yes when using a custom table in Meta Box. View Tutorial → |
| Hover & Switch Images for SureCart Products in Bricks | 11th Dec '24 | Pro  How to display a secondary image for each SureCart product when the user hovers/focus each product in a query loop. View Tutorial → |
| Changing Bricks Lightbox Arrow Icons | 21st Nov '24 | Pro  How to change the left and right arrow svg icons with custom ones in Bricks lightbox. View Tutorial → |
| Random Posts in the Same Category as the Current Single CPT Post in Bricks | 19th Nov '24 |  Here’s how query loop can be set in Bricks to show related posts by a taxonomy’s terms View Tutorial → |
| Ordering Posts by Terms in Bricks | 18th Nov '24 | Pro  How to output upcoming events at the top and past events below in a single query loop in Bricks. View Tutorial → |
| Team Member Photos Stack with Hover Tooltips in Bricks | 18th Nov '24 | Pro  Herman Baiatian shared in the Bricks Facebook group here that he worked on overlapping team member headshots showing info in hover tooltips. I recreated it by seeing his video demo and, in this Pro tutorial provide steps to set up the same. Also, check the version of BricksBee Components for Bricks Builder. We shall use… View Tutorial → |
| Filtering Posts of a Bricks Query Loop by Meta Box Group’s Subfield Value | 5th Nov '24 | Pro  How a Bricks filter can be used to limit the posts output by a Posts query loop based on a Meta Box group’s subfield value. View Tutorial → |
| Event Date and Time in Visitor’s Timezone | 31st Oct '24 | Pro  The steps for showing the value of a Meta Box datetime type of custom field in visitor’s timezone. View Tutorial → |
| Bricks Query Loop Cards with Hover Image | 30th Oct '24 | Pro  How images uploaded to posts can appear when the featured images in a Bricks posts query loop are hovered. View Tutorial → |
| CommandUI – The Fastest Way to Navigate WordPress | 29th Oct '24 |  CommandUI is an impressive WordPress plugin developed by Calvin Alkan. It enables you to go to various parts of the WordPress dashboard using the keyboard and is a great time-saver, especially for power users and those who spend a lot of time daily administering one or more WordPress sites. It is a premium plugin and… View Tutorial → |
| Left Structure Panel in Bricks Editor | 28th Oct '24 |  Eric shared some CSS code in the Bricks Facebook group to move the structure panel in between the element panel and canvas here. I think it makes more sense to move the structure panel all the way to the left to maintain the hierarchy of all elements and then see/edit the properties for the selected… View Tutorial → |
| Another Fixed Sidebar Layout in Bricks | 23rd Oct '24 | Pro  How to get the main content and sidebar sandwiched between the site header and footer. View Tutorial → |
| Custom Nested Queries in Bricks | 21st Oct '24 | Pro  In most of the previous tutorials covering nested query loops in Bricks on this site, we accessed the parent query's looping object in the inner query loop using one of the two methods shared in Parent Query Loop Object - Traversing Nested Query Loops Up in Bricks. Typically we will have a custom criterion for… View Tutorial → |
| Meta Box Group’s Number Sub Field Values Sum | 21st Oct '24 | Pro  In the Bricks Facebook group a user asked: We can define a custom function that takes a Meta Box group ID, the sub field ID and optionally, the post ID and returns the total of the specified sub field values for all rows for a post (current one by default). Then echo this function in… View Tutorial → |
| Related Posts by Taxonomy in Bricks | 19th Oct '24 | Pro  In the previous Posts Related by Current Post's Terms in Bricks tutorial, we showed how posts related to the current single post that have the same terms as the current post can be configured in a Bricks query loop. That method is not reliable esp. in situations when the terms have commas and other special… View Tutorial → |
| Weekday Column Posts Bricks Query Loop | 18th Oct '24 | Pro  The steps to arrange the posts output by a Bricks query loop(s) in weekday columns based on a weekday custom field. View Tutorial → |
| Dynamic Posts Side Menu with Expandable and Collapsible Accordion Submenus in WordPress | 17th Oct '24 | Pro  This Pro tutorial provides the steps to show all the posts of a specified post type as menu items with accordion functionality for submenus. This is especially useful for Pages and hierarchical CPTs that have parent > child posts. While Bricks was used whilst developing the solution, this technique can be implemented in any WordPress… View Tutorial → |
| Section Templates Bricks Admin Page | 14th Oct '24 | Pro  Adding a new “Section Templates” admin menu item to show the list of Bricks templates of Section type. View Tutorial → |
| ACF Flexible Content in Bricks with Each Row in its Own Section | 12th Oct '24 | Pro  How we can use flexible content where each row layout still gets its own full-width section. View Tutorial → |
| Post Data for the Current User in Bricks with Meta Box | 9th Oct '24 | Pro  How to configure a query loop to output the post data of the SalesRep CPT associated with the current user. View Tutorial → |
| Bricks Query Loop: Outputting a Fixed Number of Items | 4th Oct '24 | Pro  How to intercept the query result and modify it to output a fixed number of items by re-using the items. View Tutorial → |
| How to show a specific post’s data in a Bricks Popup | 1st Oct '24 |  This tutorial provides the steps to show a specific post's data like the title, featured image in a Bricks Popup. View Tutorial → |
| Creating Custom Add to Cart Buttons for SureCart Products in Bricks | 30th Sep '24 |  Creating custom add to cart buttons for SureCart in Bricks, adding a loading animation & tooltip for visual feedback. View Tutorial → |
| Checking if the current post has been published within the last x days | 28th Sep '24 |  Conditionally output an element if the current post has been published in the last x number of days. View Tutorial → |
| Checking if the current Page/Post has Children i.e. is a Parent in Bricks | 27th Sep '24 | Pro  Shows how we can check whether the current Page or Post (of any hierarchical post type) is a parent View Tutorial → |