How to prevent expandables from expanding in Edit mode?
Asked by Rob Bl:

When editing, I want expandables to stay collapsed until I toggle them. I have pages with dozens of expandables. It's incredibly helpful for finding the sections you need when reading these pages. It's a *nightmare* for editing because as soon as you click EDIT, *every single one* expands.

This is such an obvious problem, I'm hoping I'm missing a setting somewhere, and this is not just more bad UX design.


Answers:
author: Rob Bl
body: [@Michal Kocztorz](/t5/user/viewprofilepage/user-id/2181798)'s reply led me to a workaround that I'm posting at the top level here in order to mark it with \[Accept Answer\] so others can more easily find it and use it:

You can make your own bookmarklet that closes all the expandables. If you're unfamiliar with bookmarklets, they're little bits of javascript, added as bookmarks in your browser (hence the name), that when clicked allow you to fiddle with the page you're viewing. For example, I have a bookmarklet that makes it possible to edit the content on the page.

Anyway...here's how to make all the expanded sections collapse in the Edit view of a Confluence page:

1. In your browser, go to *Bookmarks \> Add New Bookmark*
2. Copy the javascript below, and past it into the URL for your new bookmark
3. Replace ***\&colon;***with an actual colon
4. Name your bookmark and save

Now whenever you want to collapse all those expanded sections, just click that bookmark, and KABOOM --- you're good to go.

```
javascript&colon;document.querySelectorAll('.ak-editor-expand__icon-container').forEach(e=>e.click())
```

CAVEAT: Only tested in (Chromium-based) Brave Browser, but should work everywhere since it's the page you're affecting, not the software.

comments: author: Rob Bl
body: 2nd CAVEAT: I've found that sometimes on pages where you've used the bookmarklet, it can prevent selecting/editing text inside an expandable --- BUT if you click the bookmarklet *again* it refreshes, and your fine.


author: Ravi Mani
body: This might not be the most efficient way to do this, but what I did, was collapse all the expands in my confluence page, and then save that new-view page to your bookmarks.

1. Open the page with all your Expands in \[EDIT\] mode.

2. Close the Expands with the arrow in the Top Left corner of each expand

3. Create a bookmark for the page , this will allow you to reload the page in edit mode, where the expands are all in a collapsed state until you need to edit one of the expands.

Hope this helps some folks.

comments: author: Rob Bl
body: That's a simpler solution than the [bookmarklet](https://community.atlassian.com/t5/Confluence-questions/Re-How-to-prevent-expandables-from-expanding-in-Edit-mode/qaq-p/2673373/comment-id/308744#M308744) *if* you're always editing the same pages. I have dozens, and am always making more, so this would get pretty unwieldy for me.


author: Michal Kocztorz
body: Well, I'm sure that shortly Atlassian tem will provide appropriate feature. We just need to wait a bit, 5-10 years usually works.

Meanwhile you can use this in bookmark in browser:

```
javascript&colon;(()=>{document.querySelectorAll('.ak-editor-expand__icon-container').forEach(e=>e.click());})();
```

It's not smart, but it kind of works. In edit mode it will toggle all exapndables.

It works for me, but not sure if its something that will work for everyone. I don't know confluence so much.

comments: author: Rob Bl
body: Love me a good bookmarklet! But this isn't working for me. I don't know JS well enough to fix it, but I think the forum formatting ate some if it. If nothing else,I know *\&colon;* was meant to be just a colon. Did the form formatting eat anything else? I'd be quite happy with this workaround if I can get it to behave!


author: Rob Bl
body: UPDATE: Did some screwing around with that script, using as a guide another JS bookmarklet that makes webpages editable in the browser, and got it working! Here's what I came up with. Just replace *\&colon;* with an actual colon.  

```
javascript&colon;document.querySelectorAll('.ak-editor-expand__icon-container').forEach(e=>e.click())
```

Thanks [@Michal Kocztorz](/t5/user/viewprofilepage/user-id/2181798) ! This is going to be *fantastic!*


author: Michal Kocztorz
body: I did not notice it got changed. Thank for clarifying!


author: Linh Pham_Ricksoft_Inc
body: Hi [@Rob Bl](/t5/user/viewprofilepage/user-id/4990274)

You should be able to collapse the Expand macro in Edit mode. The limitation is that you'll need to do so manually one by one, and the state does not persist after closing and re-opening the editor.

comments: author: Rob Bl
body: Exactly the problem I'm trying to prevent.

Some pages have dozens of expandables. I'd prefer to not have to close them all over and over and over again.

So the upshot here is that my option B is the answer: This is just bad UI/UX on the part of Atlassian --- which, unfortunately, comes as no surprise whatsoever.


Tags: cloud

confluence-cloud