When selecting one group I want all other sibling groups to be hidden

[tom17]

Hi there,

Newbie here!
I want to create a single page application with a lot of groups (probably 30+) on the page.
When selecting one group e.g. by clicking on a text element, I want obviously the group linked to this text element to show (that part is fine) but I also want all other sibling groups to be hidden.
I can do that by adding all sister elements one by one into a workflow but that will become very quickly painful.
Is there a clever way to “select all” & hide all sibling groups in one go ?

Thanks for your help!
Tom

[robhblake]

Hey @tom17

1. Give each section a custom state called “name” or “ID”.

2. Create a custom state on the page or wherever called “active section”

3. When you want to show a certain section use a workflow that sets the state of “active section” to whatever the value of the sections “name” is

4. Make all sections not visible on page load.

5. Include a condition on each section that says “when active section is this group’s name” → make visible.

There are other approaches but this is generally what I use.

Cheers
Rob

[tom17]

Hi @robhblake,
Thanks for that.
How do you make all sections not visible on page load? Do I have to create within the workflow multiple steps with each step hiding a specific section? Or is there a way to call all sibling sections?

[robhblake]

Just use the checkbox on each group holding the section that says “make this element visible on page load”, and uncheck that. It’s on the element editor, not via a workflow.

[tom17]

Got you!
Thank you so much @robhblake !
Tom