I'd like an easy way to expand or collapse content in lists and by headings. Use cases include:
For collapsing by headings, the Expando add-on exists, but it's not supported or available for Cloud.
For lists, the built-in Expand Macro does not work with the built-in lists.
Lists would either be collapsible by default or could be wrapped in a new macro that enables this functionality. The user should be able to expand a single item or all items at that level in the outline.
For an example of potential implementation of collapsible lists or outlines, see OneNote.
Is there a way to do this today?
Why not use the standard Macro "Expand" - put the page into edit mode >Insert>Macro
That provides a link line that allows the user to click to see the full text
I use this in FAQ tables ... first column is the question, second column includes the expand macro with the detailed answer. That means the table appears as a single line of text per question until they click the expand link.
I further format the question column as a heading style so that I can have a Table of Contents at the top of the page - hence the User can sort the table of questions alphabetically by clicking on the table header but can still see the original list of questions in the TOC and can jump straight to it
Perhaps I don't understand what you mean by a "collapsible list"
My example seems to keep the amount of text on the page at first view to a minimum (i.e. :"clean").
the "list" can be sorted
the list can have heading styles
and it is no cost using standard functionality :smile:
Those are good points!
I guess the key difference is being able to do this with standard bulleted and numbered lists.
Looks like this:
ah - I think you mean an expanding drill down list with multiple levels
e.g. at first view it looks like
but clicking on 2 shows further options
then clicking on xxxx you get
That is "easy" too - just nest the expand macros i.e. within the expand macro for "2. aaa" include another set of expand macros as "xxxx click here" and "yyyy click here", then within the box for xxxx include another expand as "qqqqq click here"
We’ve created a Heading Expand/Collapse macro as part of our toolbox of useful Confluence Cloud macros. It lets you show and hide content under any heading style and also if it should be expanded or collapsed by default.
Try it here: https://marketplace.atlassian.com/1215202
Keen to know if it helps you out, feedback is always welcome :smile:
Edit: We've also added an expand and collapse macro for bullet and numbered lists.
Thanks for the honest feedback :smile:. I can understand the issue with the pricing if you're looking just for that single feature alone.
We plan to continue expanding the number of macros included keeping it at the same price point. I'll take a look at your expandable lists request to see what's feasible considering Cloud's restrictions.
I recommend checking out the included HTML macro that lets you securely embed any HTML and JS into the page – others have found that valuable too.
Thanks again Chris!
Hi Tim, this is a great prototype! It's quite similar to what I was imagining. Cool to see it in action.
My initial constructive feedback (and you may already have considered this) is that I don't think we would want to have the entire item formatted like a link (color and underline). If the item were a paragraph of text, this would start to affect readability significantly.
In production, more ideal would be a clickable icon to expand/collapse, like the carrot bullet that is shown in your prototype.
I think we'd at least want to have an option in the macro settings as to whether the list is expanded or collapsed by default.
The ability to expand or collapse a certain level of the hierarchy without clicking every row separately could be useful, but I think this is a lower priority and wouldn't be required for the MVP. It's also a greater UI challenge to implement, I'm sure.
I look forward to seeing what you launch! Keep me posted.
Based on your feedback we’ve just released the list expand macro in the Macro Toolbox for Cloud add-on.
It works just like the prototype above but with some of the changes you suggested:
Give it a try, I'm keen to hear what you think!
Did you get anywhere with this?
I'm wondering, is there perhaps a way to do this with a minimal CSS fiddle?
I know that CSS is technically the devil with regards to passing the pages on to people that might not be technically literate, but if it's only a line to apply the H1, H2, H3, etc, style to the ".expand-control-text" class, I'm hoping that it's relatively simple.
- Create your own custom emoji 🔥 - "Shake for Feedback" on mobile 📱 - An endless supply of GIFs via GIPHY 🤩 Is there anything quite as nice as a pleasant surprise? Comment below with what...
Connect with like-minded Atlassian users at free events near you!Find an event
Connect with like-minded Atlassian users at free events near you!
Unfortunately there are no Community Events near you at the moment.Host an event
You're one step closer to meeting fellow Atlassian users at your local event. Learn more about Community Events