21st Apr '23/0 comments/

Dynamic Horizontal Posts Accordion in Bricks

Update on 8 Sep 2024: You may want to follow the newer version that considers accessibility.

Looking to make a Horizontal Image Accordion dynamic?

This article for Pro members provides JSON code that can be pasted in your Bricks Page/template to show the featured images, titles and excerpts of the 5 latest posts.

We shall also update a few query parameters to make it more performant.

Step 1

Copy the following JSON and paste in your Page/template when it is being edited with Bricks.

This is a BricksLabs Pro tutorial.

For full access login below or create your BricksLabs Pro account

Tagged:
Bricks
Horizontal Accordion
Pro
Query Loop

Sridhar Katakam

Sridhar Katakam is a Bricks enthusiast. He likes helping others by researching and solving WordPress-related problems and building websites.

Get access to all 524 Bricks code tutorials with BricksLabs Pro

Related Tutorials..

Pro
Custom SQL Ordering for Sorting Events in Bricks

Custom SQL Ordering for Sorting Events in Bricks

Showing events ordered by the event date with upcoming events in ascending order and past events in descending order.
Read more →
Categories: Bricks, Pro
Tags: Ordering, Sorting, SQL
How to create filters with IsotopeJS in Bricks (Part 4): AJAX filter and infinite loops, Sorting, List view and Disable animations

How to create filters with IsotopeJS in Bricks (Part 4): AJAX filter and infinite loops, Sorting, List view and Disable animations

This tutorial will explain how to enable the AJAX filter with an infinite scroll query loop container, how to add a sorting function, how to…
Read more →
Categories: Bricks, Free
Tags: Filters, Isotope, Query Loop
Pro
Posts Grouped by Post Dates in Bricks

Posts Grouped by Post Dates in Bricks

Setting up query loops for “Post Dates” with an the inner loop displaying all posts published on that day.
Read more →
Categories: Bricks, Pro
Tags: Nested Queries
Pro
ACPT Gallery Field Query Loop in Bricks

ACPT Gallery Field Query Loop in Bricks

How we can output images from ACPT‘s Gallery field for posts as a grid using a query loop.
Read more →
Categories: Bricks, Plugins, Pro
Tags: ACPT, Query Loop
Pro
Dynamic Horizontal Posts Accordion in Bricks

Dynamic Horizontal Posts Accordion in Bricks

Creating a horizontal accordion of featured images from posts output by Bricks' query loop.
Read more →
Categories: Bricks, Pro
Tags: Accordion, CSS
Pro
Parent post Bricks query loop

Parent post Bricks query loop

Updated on 5 Feb 2024 In the BricksLabs Facebook group a user asks: Is there a way to output the data of a parent post…
Read more →
Categories: Bricks, Pro
Tags: Query Loop
Pro
Previous Two Posts in Bricks Query Loop

Previous Two Posts in Bricks Query Loop

This Pro tutorial shows how we can modify the parameters of a Bricks query to limit the posts to the previous two whilst cycling to…
Read more →
Categories: Bricks, Pro
Tags: bricks/posts/query_vars