nav[aria-label="Primary Navigation"] { padding: 0; & ul { list-style: none; width: 100%; display: flex; flex-direction: row; justify-content: start; align-items: start; gap: 30px; padding: 0; & li { margin: 0; } & ul li { list-style: none; } } }

How to break the children display macro into two columns?

Alirezza Motti

I'm using the children display macro to show a list of pages under a certain page, but the list is too long and I'd like to break it into two columns to make it more readable and make the layout of the page nicer.

Is this possible at all with children display macro? If not, what tool would you recommend?

Cheers!

Accepted answers

All comments

Shannon S

Hi Alireza,

The native Children Display macro is not able to be displayed in more than one column. This was requested as a feature in the past but has been rejected.

You could try manually inserting the links to child pages, or see if you download the Source Editor add-on, you may be able to directly alter the formatting.

Kind Regards,
Shannon

Jeff Nayler

Shame, would have been a very useful feature

Sorana CAPALNEAN

hello,

A workaround would be to display the first n/2 children in a first "children macro", then on a second one to have them displayed in a reverse sort.

Macro #1 :

- Number of Children : n/2

- Sort Children By : title

- reverse sort : false

Macro #2 :

- Number of Children : n/2

- Sort Children By : title

- reverse sort : true

Samjad Kollanandy

It is possible with CSS and a custom macro. What I did was,

Added the following CSS to my space stylesheet:
.childpagemulticolumn ul{
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    max-height: 300px;
}
You can then create a custom macro :
The Macro Body Processing should be 'Rendered'

## @noparams
<div class="childpagemulticolumn">$body</div>
Now in your page with Children Display macro:
Insert this new custom macro and then insert 'Children Display' macro inside this new custom macro.

PS: I have admin access so I am able to edit space stylesheet and create custom macro.

Paul Mata_lbqsd9

@Samjad Kollanandy I tried implementing your solution, but it seems this no longer works. I have created the custom user macro and edited the space style sheet, both using the code you provided above, but I still get a single column display of the child pages. Any ideas what I might have gotten wrong (or if something has changed)?

Paul Mata_lbqsd9

*moved reply under correct comment*

Samjad Kollanandy

Hi @Paul Mata ,

I see that you have set childrendisplay macro style=h3.

So in the stylesheet remove ul and li, -

.childpagemulticolumn {

...

...

}

Alex_j80vo9

That worked! Thank you!

Oscar_y42kz0

the Number of Children : n/2 filter doesn't seem to apply...Any pointers?

I should add that the number of children is dynamic on my page so I used n...Maybe you used 'n' as a placeholder for the deterministic value of children on your page?

Welcome!

It looks like you're new here. Sign in or register to get started.

Quick Links

Find more posts tagged with

confluence

macro

child-page