u/crowedge

In this Bricks Builder tutorial, I’ll show you how to set up and use the built-in filtering system. We’ll cover the different filter elements, how to connect them to a query loop, and how to customize your filters to create a better user experience.

Timestamps:

• 0:00 Introduction and Demo
• 1:03 Page Structure
• 2:02 Enable Filters in Settings
• 2:58 Filter - Checkbox
• 4:50 Filter - Datepicker
• 6:27 Filter - Radio
• 7:28 Filter - Range
• 9:15 Filter - Search
• 10:54 Filter - Select
• 13:50 Filter - Submit / Reset
• 14:18 Filter - Active Filters

Learn how to customize the Bricks Builder datepicker using Flatpickr. In this tutorial, I’ll show you how to disable weekends, add date ranges, apply Flatpickr themes and use the official Flatpickr documentation to take more control over your Bricks forms.

Codes Used in Video:
https://wicky.co/how-to-customize-the-bricks-builder-datepicker/

In this tutorial, you'll learn a simple CSS trick for building premium-looking hero sections with perfectly aligned content and full width images using calc(), max(), and CSS variables. No CSS Grid required.

CSS Codes:
max(0px, calc((100% - 1440px) / 2))
max(0px, calc((100% - var(--content-width)) / 2));

In this video, you'll learn how to add fallback images in Bricks Builder for both standard image elements and dynamic background images. This is a great way to prevent broken or empty layouts when featured images or custom fields are missing.

Timestamps:

• 0:00 Introduction
• 0:50 Image Element - Fallback Image
• 2:22 Background Image - Fallback Image

Bricks Fallback Documentation

If you've ever wanted more control over responsive design in Bricks Builder, this tutorial is for you. Learn how to enable, create, and manage custom breakpoints so you can fine-tune your layouts for laptops, large desktops, and any screen size in between. Perfect for beginners and anyone switching from Elementor.

Timestamps:

• 0:00 Introduction
• 2:11 Enable Custom Breakpoints

In this video in the Elementor to Bricks Series, I'll show you how to create headers and footers in Bricks Builder. If you're coming from Elementor, you'll learn where these are managed, how template assignments work, and the differences in Bricks so you can build site-wide headers and footers.

Timestamps:

• 0:00 Introduction
• 1:09 Create Header Template
• 4:21 Create Footer Template

In this video, I'll explain how Bricks Builder handles Sections, Containers, Blocks, and Divs, and compare it to Elementor's layout system. If you're switching from Elementor to Bricks, this will help you understand the differences and why many developers prefer Bricks' cleaner approach.

Timestamps:

• 0:00 Introduction
• 2:29 Sections, Containers, Blocks & Divs Explained

In this first video of the Elementor to Bricks Series, I'll walk you through the key differences between the Elementor and Bricks builders. By the end of the video, you'll have a solid understanding of how the two builders compare and how Bricks approaches building websites differently.

Timestamps:

• 0:00 Introduction
• 0:43 Bricks Is a Theme, Not a Plugin
• 1:37 WordPress Settings: Elementor vs Bricks
• 6:49 Comparing the Elementor & Bricks Builders

I’m planning to make a series of videos specifically for Elementor users moving to Bricks Builder.

If there’s a particular topic you’d like to see covered, let me know. I’d love to include it in the video series.

In this Bricks Builder tutorial, I'll show you how to overlay an image on top of a background using an absolutely positioned image. This technique lets you easily add textures, PNG overlays, gradients, and other visual effects to hero sections, banners, and any container in your website.

Learn how to create a smooth, responsive infinite logo carousel using only HTML and CSS. In this tutorial, you'll build a seamless scrolling logo slider with no JavaScript, no plugins, and no external libraries. Perfect for client logos, partner logos, testimonials, and brand showcases in any website project.

Download HTML & CSS Code:
https://wicky.co/build-a-seamless-infinite-logo-slider-with-pure-css/

Learn how to create a smooth horizontal scrolling section in Bricks Builder using GSAP ScrollTrigger. In this step-by-step tutorial, I'll show you how to build a pinned horizontal scroll effect, animate content as users scroll, and create modern website interactions without additional plugins.

Download GSAP Code:
https://wicky.co/bricks-builder-gsap-horizontal-scroll-effect-tutorial/

I just created a new Bricks & JetEngine tutorial for the Crocoblock team!

This is a great tutorial if you want to learn how to connect Bricks and dynamic data from JetEngine.

In this GSAP and Bricks tutorial, I’ll show you how to easily create a highlight text on scroll effect as the user scrolls down the page.

Download GSAP Code

In this Bricks tutorial, I’ll show you how to use the Bricks Builder only on selected posts when needed.

Timestamps:
0:00 Intro / Demo
0:31 Enable Bricks on Posts
0:57 Create WordPress Post Template
4:21 Create Bricks Post Template

In this video, I’ll show you a simple way to make your section backgrounds change color on scroll.

Download CSS and JavaScript Code:
https://wicky.co/bricks-builder-scroll-background-color-change-tutorial-no-plugins/

In this video, I’ll walk you through how to correctly set up sticky elements inside columns using Bricks Builder.

Timestamps:
0:00 Intro / Demo
0:25 Add 2 Column Layout
1:49 Make Block Sticky
2:25 Assign Height to Sticky Column
2:57 Assign Max Width to Sticky Column
4:35 Add Column Gap
5:45 Add Top Offset
6:25 Sticky Responsive Controls

In this Bricks video, I’ll show you a custom mobile menu system I built. I created this because I feel the native mobile menu system in Bricks doesn’t give you full control on mobile devices.

With this new system, you’ll have complete control over your mobile menu, including smoother scrolling behavior and the ability to add extra elements inside the mobile menu without issues.

Hey Everyone

This is Mark from Wicky, and I’m excited to start creating Bricks Builder tutorials on our new YouTube channel. Some of you may have come across my Elementor and Crocoblock videos over the years, but I’m now shifting away from Elementor and focusing fully on Bricks moving forward.

I plan to create much more in-depth and advanced tutorials in the future, and I’m looking forward to giving back to the community by sharing what I’ve learned along the way.

Be sure to let me know what future tutorials you’d like to see on the channel!