15th May '24
/
8 comments

Filtering Masonry-layout Posts by Categories in Bricks using Isotope

Filtering Masonry-layout Posts by Categories in Bricks using Isotope

Updated on 29 Jul 2024

This Pro tutorial provides the steps to set up Isotope in Bricks for filtering posts by categories.

This tutorial can also be applied to filtering a CPT posts by its custom taxonomy terms with a few changes.

Step 1

Edit a Page or a archive template with Bricks.

Copy the JSON from the link below and paste to import the fully-built Section from our dev site.

This is a BricksLabs Pro tutorial.

For full access login below or create your BricksLabs Pro account

Get access to all 633 Bricks code tutorials with BricksLabs Pro

Related Tutorials..

Pro
Stripe’s Animated Gradient in Bricks

Stripe’s Animated Gradient in Bricks

This Pro tutorial provides the steps to set up an animated gradient as a background of a section in Bricks using the code generated by…
Categories:
Pro
Sticky Scrolling in Bricks Builder

Sticky Scrolling in Bricks Builder

Updated on 22 Apr 2024 This Pro tutorial provides the steps to fix elements in the viewport i.e., make them sticky while adjacent content in the section…
Categories:
Tags:
Pro
Ken Burns Background Slideshow in Bricks

Ken Burns Background Slideshow in Bricks

Setting up a hero section, having images that pan and move as a background slideshow with content on top.
Categories:
Tags:
Pro
Floating Bottom Div when Scrolling Down in Bricks

Floating Bottom Div when Scrolling Down in Bricks

Creating a floating call to action element that reveals only as the user scrolls down.
Categories:
Tags:
Animated Border Hover Effect Buttons

Animated Border Hover Effect Buttons

Here's how can be implemented in HTML/WordPress/Bricks. Step 1 Add this CSS in your child theme's style.css or another appropriate location: Step 2 Add a…
Categories:
Pro
Oxygen’s Focus Section in Bricks

Oxygen’s Focus Section in Bricks

These are the steps to implement Focus Section, an Oxygen’s composite element, in Bricks.
Categories:
Pro
Image Banner as Query Loop Posts Grid’s Last Item in Bricks

Image Banner as Query Loop Posts Grid’s Last Item in Bricks

In the comments section of How to Insert Element(s) Between Query Loop Posts in Bricks tutorial, a site member asked: This is fantastic! Is there…
Categories:
Tags:
Floating Element in Bricks

Floating Element in Bricks

How to create a floating element in Bricks that appears across the entire website.
Categories:
Tags:
Add masonry style to the Remote Template list

Add masonry style to the Remote Template list

This article will show you how to transform the remote templates list of Bricks in a masonry style without cropping your images - it will…
Categories:
Tags: