Build More Dynamic Websites

Bricks & WordPress Tutorials

Hundreds of step-by-step tutorials and done-for-you code snippets to help you build custom, dynamic solutions in WordPress using Bricks Builder

Latest Tutorials

Pro
How to move data attributes from outer element to nested element in Bricks

How to move data attributes from outer element to nested element in Bricks

Consider a scenario where a Container/Block in Bricks is made up of image on the left side and a heading with text blurb on the right with both image and…
Read more β†’
Pro
Nested Query Loops with Dynamic Author Filtering in Bricks

Nested Query Loops with Dynamic Author Filtering in Bricks

This Pro tutorial provides the steps to set up nested query loops in Bricks for grouping posts by their authors. For the posts under each author, we shall show one…
Read more β†’
Pro
Auto-expand Current Post’s First Category in Categories Accordion

Auto-expand Current Post’s First Category in Categories Accordion

In the BricksLabs Facebook group, a user asked: This Pro tutorial provides the steps to set up nested query loops in the single post (can be standard posts or a…
Read more β†’
Custom Image Field Avatar in WordPress

Custom Image Field Avatar in WordPress

Learn how to use a Meta Box image field value as the author profile image on single post pages in WordPress/Bricks.
Read more β†’
Categories:
Tags:
Pro
Masonry Accordion Query Loops in Bricks Builder

Masonry Accordion Query Loops in Bricks Builder

Learn how to enable masonry layout for nestable accordions in Bricks builder and use JavaScript to re-layout the masonry on accordions' open and close.
Read more β†’
Categories:
Tags:
Pro
Per-Category Load More with Post Count in Bricks Builder Nested Query Loops

Per-Category Load More with Post Count in Bricks Builder Nested Query Loops

In the BricksLabs group, a user asks: Hi everyone! I'm working on a website where I need to list a large number of products on the product archive page, which…
Read more β†’
Pro
Dynamic Remaining Posts Count for Load more Button in Bricks

Dynamic Remaining Posts Count for Load more Button in Bricks

A user asked in the Bricks Facebook group: I have a loop of a CPT, showing 10 in a total of 16 posts and a load more button. I need…
Read more β†’
Pro
Post Published Year Range Slider in Bricks

Post Published Year Range Slider in Bricks

Learn how to set up the year in which post was published as a custom field for posts and use this as a source for filtering posts in Bricks.
Read more β†’
Categories:
Pro
WooCommerce Products Live Search in Bricks

WooCommerce Products Live Search in Bricks

This Pro tutorial provides the steps to set up a live search for WooCommerce products in Bricks. Note: Bricks' live search works with any type of query, not just posts.…
Read more β†’
Categories:
Pro
How to Add a Live Search to Filter Posts Grouped by Categories in Tabs

How to Add a Live Search to Filter Posts Grouped by Categories in Tabs

This Pro tutorial builds on top of the earlier Dynamic Tabs in Bricks tutorial and provides steps to add a live search input for filtering the posts by post titles…
Read more β†’
Categories:
Tags:
Pro
How to Redirect WordPress Search to WooCommerce Shop Filter by Product Title or SKU

How to Redirect WordPress Search to WooCommerce Shop Filter by Product Title or SKU

Learn how to redirect users to the Shop page with filtered results if the searched term matches a WC product title or SKU. And, if it does n't, to the…
Read more β†’
Categories:
Pro
Outputting an Element in Bricks x times where x is a custom field value

Outputting an Element in Bricks x times where x is a custom field value

Learn how to output a query loop item(s) as many times as the value of a custom field in Bricks.
Read more β†’
Categories:
Pro
How to Add Support for Variable Products in Bricks WooCommerce Filters

How to Add Support for Variable Products in Bricks WooCommerce Filters

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…
Read more β†’
Categories:
Pro
How to Show Header & Footer on WooCommerce My Account Endpoints in Bricks

How to Show Header & Footer on WooCommerce My Account Endpoints in Bricks

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.
Read more β†’
Categories:
Searchable WordPress Timezone Dropdown

Searchable WordPress Timezone Dropdown

A must-use plugin for WordPress that helps you quickly select your city in the general settings for timezone.
Read more β†’
Categories:
How to change Ctrl/Cmd+Shift+V shortcut to View on frontend in Bricks

How to change Ctrl/Cmd+Shift+V shortcut to View on frontend in Bricks

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.
Read more β†’
Categories:
Pro
Collapsing all accordion items on mobile in Bricks

Collapsing all accordion items on mobile in Bricks

Learn how to collapse all items of Bricks nestable accordions at a specific breakpoint.
Read more β†’
Categories:
Tags:
Pro
Deep Linking to Headings inside Bricks Tab Panes via URL Hash

Deep Linking to Headings inside Bricks Tab Panes via URL Hash

Learn how to link to a specific heading inside a Tabs (Nestable) element's tab pane content using custom JavaScript.
Read more β†’
Categories:
Tags:
  • BricksLabs Pro
    Level-up your skills and do more with Bricks.
    Get access to a growing library of Bricks specific tutorials and code solutions for building dynamic WordPress sites.
    • 633 Step-by-step Bricks tutorials
    • Regular updates
    • Support on implementation
    • Active FB community (2900+ members)
    • User tutorial requests*
    • Lifetime pricing available

FAQs