8th Feb '24
/
3 comments

Bricks Query Loop for Top-level Parent Pages with Children

In the Bricks Facebook group, a user asked:

Looking for a custom query to output a list of posts in the same hierarchy that the posts use. For example, the posts are like:

Parent 1

- child A

- child B

Parent 2

- child C

- child D

That's the way I need to build an unordered list. If you just query posts you get them all without hierarchy, for example (if sorted by name) child A, child B, child C, child D, Parent 1, Parent 2.

Anyone have a code snippet that will accomplish this?

WordPress has a wp_list_pages() function for showing a list of all Pages, but it outputs all Pages, and there's no direct way to specify that only the top-level Pages and their children are to be included.

This Pro tutorial provides the steps to output top-level parent posts (can be Pages or any hierarchical post type) and their child posts using nested query loops in Bricks.

Given this Page structure:

this will be the output after implementing the tutorial:

Step 1

Edit the Page where you'd like to show the top-level parent Pages and their children with Bricks.

Section JSON is provided near the end.

Add a Section and inside its Container, a Container (UL).

Add a Block (LI) inside the Container.

Enable query loop on the Block.

Post type: Pages

Enable PHP query editor.

This is a BricksLabs Pro tutorial.

For full access login below or create your BricksLabs Pro account

Get access to all 626 Bricks code tutorials with BricksLabs Pro

Related Tutorials..

Pro
Post Titles and Post Content Tabs in Bricks

Post Titles and Post Content Tabs in Bricks

How to set up Nestable tabs with post titles as the tab menu, and post content and/or any other post-specific data as the tab content.
Categories:
Pro
How to Insert Element(s) Between Query Loop Posts in Bricks

How to Insert Element(s) Between Query Loop Posts in Bricks

Update on 16 Aug 2023: Follow this tutorial instead. This Pro tutorial shows how we can insert a Div (or any custom HTML) after nth…
How to populate a map with dynamic markers from a CPT using ACF in Bricks (PART 2)

How to populate a map with dynamic markers from a CPT using ACF in Bricks (PART 2)

This tutorial provides the PHP & JS codes that can be pasted in order to create a flying effect on map markers each time your…
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…
Categories:
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…
Categories:
Pro
Related Episodes Grouped by Episode Chapters on Single Podcasts in Bricks when using JetEngine

Related Episodes Grouped by Episode Chapters on Single Podcasts in Bricks when using JetEngine

A user asks: How to Display Related Episodes Grouped by Chapters on a Podcast Page in Bricks? Hi everyone, I have two post types created…