How to create an "Expand All" button for Confluence
Asked by Timothy Chen:

Hi

I've been using the expand macro a lot to organise my data (like a faq) but and am now having trouble searching for things (using the quick search). I can use the quick search to locate the page I'm after. But then I need to manually toggle open each and every expand field, before I can use the normal cntrl-f to find what I'm looking for.

Does anyone know of a way I can install an addon with this Expand All feature, or possibly a way to code my own macro?

A massive thanks in advance for helping!

Tim


Answers:
author: ernie chang
body: Discused in the documention - not a macro, but a javscript solution.

<https://confluence.atlassian.com/display/DOC/Expand+Macro?focusedCommentId=452100227#comment-452100227>

comments: author: Timothy Chen
body: Thanks Ernie, your comments and code is really helpful.  
This should be all we need for now!  


author: Dmitry Ree
body: this links directs to the confluence documentation


author: ryan harvey
body: yeah, I wish I were able to see the javascript solution that Timothy finds so helpful. This documentation page is exactly the opposite of what I'm looking for: it shows how to implement the "expand" section that I find so annoying!


author: Tim Bradt
body: Yes, it appears the solution is no longer accessible, which is a big shame. I'm thinking Atlassian must have removed the access to comments on their documentation, and this solution was in the comments. :-(


author: amna
body: hello , i don't know if you find the solution but after looking in to a lot of pages i tried this and it work :

1- first create user macro:

general configuration -\> user macro \>create a user Macro

name your macro expandall then past this and save it :

## Macro title: Expand All  
## Macro has a body: N  
## Developed by: George Lewe  
## Date created: 2014-09-22  
## Installed by: George Lewe  
## @noparams  
\<a id="toggleAll" href="#"\>Expand/Collapse All\</a\>  
\<script type="text/javascript"\>  
AJS.toInit(function ()  
{  
AJS.$('#toggleAll').click(function()  
{  
jQuery(".expand-control").each(function(){ jQuery(this).trigger("click");})  
});  
});  
\</script\>  
2-if you want to put this macro on one page you can just do this

```
{expandall} 
```

but if you want to add this to all pages in the confluence :

go to look and feel -\> layout -\> page layout -\> add it where you want :

#set($helper = $action.helper)  
$helper.renderConfluenceMacro("{expandall}")  
Thank you,  
Amna

comments: author: Raymond Santangelo
body: That was exactly what we needed, worked like a charm ... you rock, Amna!


author: DebbieR
body: Hi,Is there another way to add this to all pages when you use the Documentation theme as I get a message "You can not customise the site look and feel while a theme is active. You must first disable the currently configured theme."? Thanks


author: Kelly Johnson
body: This was great. Worked perfectly.


author: florian.rathgeber
body: No need for jQuery, you can do this in plain ES6 these days:

```
[].forEach.call(document.querySelectorAll('.expand-control'), x => x.click())
```


author: Zachariah Carmichael
body: Here is an improvement (in the case that some {Expand} macros are in opposing states, e.g. some collapsed, some expanded) -

```
<a id="toggleAll" href="#">Expand/Collapse All</a><script type="text/javascript">AJS.toInit(function (){AJS.$('#toggleAll').click(function(){var expanded = jQuery(".expand-control-icon.expanded").closest("div");var unexpanded = jQuery(".expand-control-icon:not(.expanded)").closest("div");if (expanded.size() > unexpanded.size()) {    expanded.each(function(){ jQuery(this).trigger("click");})} else {    unexpanded.each(function(){ jQuery(this).trigger("click");})}});});</script>
```

Simply place in an HTML code block or follow @amna's reply to create a user macro.


author: Volker Weinreich
body: Thanks, that's what I was looking for.


author: Volker Weinreich
body: Here is a further improvement: The button (idea of [@Scott Fordin](/t5/user/viewprofilepage/user-id/1203174)) is shown as pressed, when all sections are expanded using the AUI-Button state "aria-pressed"

```
<p align="center"><button name="toggleAll" id="toggleAll" type="button" class="aui-button" aria-pressed="false">Expand/Collapse All</button></p>

<script type="text/javascript">
AJS.toInit(function ()
{
AJS.$('#toggleAll').click(function()
{
var expanded = jQuery(".expand-control-icon.expanded").closest("div");
var unexpanded = jQuery(".expand-control-icon:not(.expanded)").closest("div");

if (expanded.size() > unexpanded.size()) {
expanded.each(function(){

jQuery(this).trigger("click");

jQuery ("#toggleAll").attr("aria-pressed", jQuery (this).attr("aria-pressed") == 'false' ? "true" : "false" );

})

} else {

unexpanded.each(function(){

jQuery(this).trigger("click");

jQuery ("#toggleAll").attr("aria-pressed", jQuery (this).attr("aria-pressed") == 'true' ? "false" : "true" );

})
}
});
});

</script>
```


author: Michelle Rau HP
body: Hey, that works slick. Thank you! This is something that really bugs my most engaged users, not being able to find something in non-expanded text on a page. Especially when search results said it's there!


author: Scott Froelich
body: Hello Everyone,

I found that the expand all macro posted from Ben Coughlan below works perfectly, except for the fact that it does not take into account of the current state of the list (expaned vs unexpanded) when toggling. The HTML listed above does take into account whether the list is in opposing states, however, I have not been able to get this to work as Michelle Rau states above. It creates the button just fine, but nothings happens when I click on it.

Has anyone else gotten this to work for expanding all lists regardless of the states they are in? My problem is that if any of the expanded lists are already expanded and I hit "Expand all", they become unexpanded while the rest become expanded. If anybody has gotten the above code from Volker or Zachariah to work, could you please explain how?


author: Volker Weinreich
body: Hi Scott,

if you get the macro posted from Ben Coughlan (which is the same as amnas) to work, I can't figure out why there seems to be a problem with the above code. And if you get it to work, you know how to use the html macro. The code I have posted works in Con 5.10.8 and still does in Con 6.13 within a html macro or within a user macro. It only works for the [expand macro](https://confluence.atlassian.com/doc/expand-macro-223222352.html).

The user macro should work as follows: If there are more collapsed expand macros, all macros should expand. If there are more expanded expand macros, all macros should collapse. The button is light, if collapsed, and dark, if expanded.

How is the structure of page? Do you put divs around the expandable content? This could cause problems.

I am not a javascript and jquery expert, but in some cases it could be, that the jquery runs twice. Then you could add this

AJS.$("#toggleAll").unbind('click');

before

AJS.$('#toggleAll').click(function()

I hope I was able to help you.

Volker


author: Raduz
body: Hi Scott,

instead of these lines:

```
var expanded = jQuery(".expand-control-icon.expanded").closest("div");
var unexpanded = jQuery(".expand-control-icon:not(.expanded)").closest("div");
```

use these:

```
var expanded = jQuery(".expand-icon.aui-iconfont-chevron-down").closest("div");
var unexpanded = jQuery(".expand-icon.aui-iconfont-chevron-right").closest("div");
```

Hope it will help you.

Raduz


author: Casey Maynard
body: The original version works great. I have an very extensive cascade of expands (sometimes about 6 levels deep). (Note: It takes awhile for the page to refresh once I push the Expand/Collapse button, but it is a minimal wait). I created an 'Index' section that uses the 'anchor' feature, allowing users to jump to commonly referenced sections of the document. And since the anchors will not work unless all of the expands are expanded. So I GREATLY appreciate this script's ability. Thanks.


author: Casey Maynard
body: I used an HTML Macro with this text (credit to those in this thread whose solutions are implemented in this layout.

\<p align="left"\>\<button name="toggleAll" id="toggleAll" type="button" class="aui-button" aria-pressed="false"\>Expand/Collapse All\</button\>\</p\> \<script type="text/javascript"\> AJS.toInit(function () { AJS.$('#toggleAll').click(function() { var expanded = jQuery(".expand-control-icon.expanded").closest("div"); var unexpanded = jQuery(".expand-control-icon:not(.expanded)").closest("div"); if (expanded.size() \> unexpanded.size()) { expanded.each(function(){ jQuery(this).trigger("click"); jQuery ("#toggleAll").attr("aria-pressed", jQuery (this).attr("aria-pressed") == 'false' ? "true" : "false" ); }) } else { unexpanded.each(function(){ jQuery(this).trigger("click"); jQuery ("#toggleAll").attr("aria-pressed", jQuery (this).attr("aria-pressed") == 'true' ? "false" : "true" ); }) } }); }); \</script\>


author: Thomas Kramer
body: Hi [@Casey Maynard](/t5/user/viewprofilepage/user-id/1140025)

thanks for this input. Sound great.

As I just learned, HTML marcos seem to be onpremise-only. We are using Confluence cloud. Is there any chance to use this approach similarly w/o user defined macros?

Thanks a lot

Thomas


author: Casey Maynard
body: We also use a server side system, so I am not able to help without the use of user macros. Maybe there is an 'add-on' that is available to do this? Although... of course ... it will cost $$. Apologies for no useful answers. Thanks.


author: Ian Lim
body: Hello everyone,

The suggestions above look very promising. However, I am not able to find a way how to enter those codes in an article. Can you give me the step-by-step procedure of where to start? Like how to insert and apply HTML or JavaScript codes? I'm new to Confluence Cloud and using version 1000.0.0-4fb864544fc8.

Thank you!


author: Ben Coughlan
body: Step 1: Insert a html macro.

Step 2 : Paste the following.

\<a id="toggleAll" href="#"\>Expand/Collapse All sections\</a\>  
\<script type="text/javascript"\>  
AJS.toInit(function ()  
{  
AJS.$('#toggleAll').click(function()  
{  
jQuery(".expand-control").each(function(){ jQuery(this).trigger("click");})  
});  
});  
\</script\>

Step 3: Throw the feet up :smile:

comments: author: Anand Tungaturti
body: Threw my feet up. Yay!

Thanks a lot.


author: Frank_Spafford
body: I wish I could use an HTML macro, but this feature is not enabled and it seems to require system-administrator privilege. I sure wish Confluence was not so restrictive. Thanks for the tip.


author: Scott Fordin
body: Brilliant, Ben! I just tweaked the first line of your HTML to use a \<button\> element instead of an \<a href\> element:

```
<p align="center"><button name="toggleAll" id="toggleAll" type:"button">Expand/Collapse All Sections</button></p>
```

This makes a nifty centered button, and also doesn't alter the URL in the browser address bar. Everything otherwise works the same as the code you so kindly posted.

Thanks again!


author: Scott Fordin
body: Ack. Welcome to the neighborhood... I just realized there's a minor typo ("type:" instead of "type=") in the sample I posted yesterday. The sample still works, despite the typo, but it's annoying to an OCD type like myself. Here's an updated sample that uses the "=" sign consistently:

```
<p align="center"><button name="toggleAll" id="toggleAll" type="button">Expand/Collapse All Sections</button></p>
```

Thanks for listening.


author: louis intorre
body: Hi, wondering how to do this for a single, specific, expand macro? Basically i'm just looking to "replace" the clickable text "Click here to expand..." with a button to do the same? I'm fairly new to JavaScript and jQuery but i was thinking: instead of the ".each" in the jQuery and replace it with something static, like macro-id....but no luck.

Any thoughts?


author: Volker Weinreich
body: Hi,

all the functions described on this page are (only) toggling the current status of the expand macros on an confluence page. If I have 5 expand macros on page and the first two are expanded and the last three are closed, the button will close the first two and open the last three.

Is there a way to really expand/close **all**regardless of their status?

Thanks,

Volker


author: Sandi Mathers
body: You guys are awesome for providing this feature \& button---thank you!!!


author: Michelle Rau HP
body: Interesting -- I tried this out and it worked very well except that an expand macro inside an expand macro did not expand.

However, when I exported the page as a PDF, all the expanded macros printed as expanded in the PDF.

Thanks for this!


author: Michelle Rau HP
body: I'm still using and liking this macro, however it seems to have a conflict with "export page as PDF." Any ideas why that might be?

System error

### Cause {#toc-hId-1061387006}

com.atlassian.confluence.importexport.ImportExportException: Exception while rendering the PDF document /opt/webhost/wiki/confluence-home/temp/pdfexport-20190529-290519-2100-214/Sirius-Home-290519-2100-215.pdf  
at com.atlassian.confluence.extra.flyingpdf.FlyingSaucerXmlToPdfConverter.convertXhtmlToPdf(FlyingSaucerXmlToPdfConverter.java:87)

caused by: java.lang.NullPointerException  
at Unknown location


author: Casey Maynard
body: [Scott Fordin](https://community.atlassian.com/t5/user/viewprofilepage/user-id/1182739)

How can I make the button larger and change the color ?


author: David May
body: ```
No user macro required. Stick this at the bottom of the page in an HTML macro and you're done.
```

```
<script type="text/javascript">AJS.toInit(function() {	$(".expand-control").trigger('click');});</script>
```

comments: author: rinky choudhary
body: Works like a charm!


author: boardtc
body: Works brilliant but note that if you have more than one expand macro on the page all will be open. Any solution to do that?


author: Jerry O'Sullivan
body: ```
$(".expand-control").first().trigger('click');
```

I only wanted to expand my first block and altered the code this way....Thanks David May


author: Casey Maynard
body: Well this one 'works' to expand. But I wanted to be able to 'toggle' them expanded and then collapse them.

Additionally if you have any tables in your expands they do not get displayed correctly.


author: Scott Fordin
body: Okay, this is pretty much a total rework of the Expand/Collapse script that I previously posted, which was in turn a riff on Ben Coughlan's excellent starter script.

My new script builds on the original, but takes several different approaches. The following are some key features of this new version:

1. There are actually two scripts here, embedded in a single text file:  
   * "Expand All" expands all content contained in Confluence EXPAND macros, regardless of the current macro state (that is, expanded or collapsed).
   * "Collapse All" collapses all EXPAND content, likewise regardless of the current macro state.  
2. It's worth reiterating that the expand/collapse behavior in this new code differs in an important way from the previous version; specifically:  
   * In the previous version, the expand/collapse behavior was a page-wide toggle: that is, all expanded topics were collapsed, and all collapsed topics were expanded. If a user had opened some topics but not others, the script would just flip/flop the state of things. This made it difficult for users to confidently attain an "everything expanded" or "everything collapsed" page state.
   * By contrast, in this new version, "Expand All" means just that: expand everything regardless of its current expand/collapse state. "Collapse All," similarly, collapses everything regardless of it current state.  

3. The size and placement of the control buttons, button block, and block text are now determined by a small set of CSS declarations embedded with the script. You can customize these styles to your liking, or just use the defaults that I've defined here.  
   * By default, the Expand All/Collapse control buttons are now much smaller and less intrusive.
   * By default, the button block is also much smaller now, and floats in a fixed position at the bottom-left corner of the page, regardless of the page scroll position.

Enough talk. Here is the code:

```
<!-- ====================================================== -->
<!-- "EXPAND ALL" AND "COLLAPSE ALL" SCRIPTS FOR CONFLUENCE -->
<!-- ====================================================== -->
<!-- AUTHOR
Scott Fordin 2018-2019
-->
<!-- DESCRIPTION
This code provides user-accessible "Expand All" and "Collapse All" controls for use on Confluence wiki pages. 
-- The "Expand All" script expands all content contained in Confluence EXPAND macros, regardless of the current macro state (that is, expanded or collapsed).
-- The "Collapse All" script collapses all content contained in Confluence EXPAND macros, regardless of the current macro state.
-->
<!-- PURPOSE
Typical in-browser text-search mechanisms (for example, Ctrl+F) do not examine page content that is contained in collapsed Confluence EXPAND macros. This means that a user will not obtain comprehensive search results unless s/he first expands all EXPAND macros before performing a given search. Confluence does not provide a native control to open all EXPAND content at once, which means that users must painstakingly open each EXPAND macro manually. To get around these limitations, the "Expand All" script expands all EXPAND macros, regardless of the current macro state. Conversely, the "Collapse All" button collapses all EXPAND macros.
-->
<!-- IMPLEMENTATION
This "Expand All" and "Collapse All" implementation comprises four general components:
* JQuery/Javascript&colon; One script for "Expand All"; another script for "Collapse All."
* HTML: Snippet containing separate user-clickable "Expand All" and "Collapse All" buttons.
* CSS: Styling for the HTML buttons. In this implementation, the buttons float in the bottom right corner of the browser viewport, and stay in place as the page is scrolled.
* Confluence HTML macro: The entirety of this file must be embedded in a Confluence HTML macro on the given Confluence page. Obviously, for this to work, the Confluence site admin must allow HTML macros on your site.
-->
<!-- CONFIGURATION
There are several general ways for a Confluence site admin or a page author to make these scripts available on a page:
* PAGE TEMPLATE: Create a Confluence page template that contains the HTML macro with the script code. The location of the macro on the page does not matter; for example, you can put it at the end of the page.
* DIRECTLY EMBED: Embed the HTML macro directly on the given page.
* INCLUDE BY REFERENCE: Saving the best for last, put the HTML macro in an EXCERPT macro on a shared page, and then use an EXCERPT INCLUDE macro to embed the HTML macro by reference on other pages; one source location, any number of target pages; this is the best way to go, IMHO. 
-->
<!-- LAST MODIFIED
March 8, 2019
-->

<!-- ======================== -->
<!-- CSS for the button block -->
<style type="text/css">
.div_expand-collapse_all {
text-align:center;
font-size:.8em;
border-radius:.3em;
border-width:thin;
border-style:solid;
border-color:#cce9cd;
background-color:#ddfade;
position:fixed;
bottom:0;
right:0;
padding:.5em;
z-index:200;
}
.div_expand-collapse_all:before {
content:"Expand topics before searching for text!"
}
.buttons_expand-collapse_all {
font-size:.8em;
margin-top:.2em;
}
</style>

<!-- ======================================= -->
<!-- "Expand All" and "Collapse All" buttons -->
<div class="div_expand-collapse_all"><br />
<button class="buttons_expand-collapse_all" name="expandAll" id="expandAll" type="button">Expand All</button>
<button class="buttons_expand-collapse_all" name="collapseAll" id="collapseAll" type="button">Collapse All</button>
</div>

<!-- =================== -->
<!-- "Expand All" script -->
<script type="text/javascript">
AJS.toInit(function() {
AJS.$('#expandAll').click(function() {
AJS.$('.expand-container').each(function() {
if (AJS.$('.expand-content', this).css('display', 'none').css('opacity', '0')) {
AJS.$('.expand-control .expand-control-icon', this).addClass('expanded');
AJS.$('.expand-content', this).removeClass('expand-hidden');
AJS.$('.expand-content', this).css('display', 'block');
AJS.$('.expand-content', this).css('opacity', '1');
}
});
});
});
</script>

<!-- ===================== -->
<!-- "Collapse All" script -->
<script type="text/javascript">
AJS.toInit(function() {
AJS.$('#collapseAll').click(function() {
AJS.$('.expand-container').each(function() {
if (AJS.$('.expand-content', this).css('display', 'block').css('opacity', '1')) {
AJS.$('.expand-control .expand-control-icon', this).removeClass('expanded');
AJS.$('.expand-content', this).addClass('expand-hidden');
AJS.$('.expand-content', this).css('display', 'none');
AJS.$('.expand-content', this).css('opacity', '0');
}
});
});
});
</script>
```

Hope this helps!

comments: author: Jesse Howard
body: The code was wonderful, thanks so much for your help. This fixed my issue with having a bunch of tables on the page that were collapsed (Expand macro).


author: Andre Messa
body: So when I enter this code the the buttons display in my pages edit mode. However, after I save, the button do not show on my page. Once I go back into edit mode the code has been stripped. Is this behavior something that is taking place because it is a corp wiki?


author: Patrick Chen
body: Has anyone else had luck getting this working in Confluence Cloud?


author: Ray K.
body: Is there a way to do this for **UI-** Expand (*NOT* regular Expand)?

comments: author: Ray K.
body: Never mind, I figured it out! The UI-Expand class name is "rwui_expand"!


author: Anna Andersson
body: I'm trying to fond out how to create a Expand/Collaps All macro for UI-Expand.

Could you please describe how you solved it?


author: Katie Crick
body: Cecilia I was also trying to figure it out and came across his more descriptive answer in another forum. :-)

Ray K.:

I took the code from the Atlassian forum and changed it from this:

    jQuery(".expand-control").each(function(){ jQuery(this).trigger("click");})

to this...

    jQuery(".rwui_expand").each(function(){ jQuery(this).trigger("click");})

Works like a champ!


author: Anna Andersson
body: Thanks KatieC! That works perfect! :)


author: Lynn Long
body: which code I tried this in both codes on here and the UI is not eorking for me ?


author: Casey Maynard
body: [Search for my user name. The solution I posted worked for me.](https://community.atlassian.com/t5/Confluence-questions/How-to-create-an-quot-Expand-All-quot-button-for-Confluence/qaq-p/294206?tempId=eyJvaWRjX2NvbnNlbnRfbGFuZ3VhZ2VfdmVyc2lvbiI6IjIuMCIsIm9pZGNfY29uc2VudF9ncmFudGVkX2F0IjoxNTg4MTc5MzQ4ODkyfQ%3D%3D#U1364756)


author: Lynn Long
body: this link brings me back to this page


author: Casey Maynard
body: search for my user name in this thread. the solution there seems to work.


author: Lynn Long
body: \<p align="left"\>\<button name="toggleAll" id="toggleAll" type="button" class="aui-button" aria-pressed="false"\>Expand/Collapse All\</button\>\</p\> \<script type="text/javascript"\> AJS.toInit(function () { AJS.$('#toggleAll').click(function() { //var expanded = jQuery(".expand-icon.aui-iconfont-chevron-down").closest("div"); //var unexpanded = jQuery(".expand-icon.aui-iconfont-chevron-right").closest("div"); var expanded = jQuery(".rw_open.rwui_expand"); var unexpanded = jQuery(":not(.rw_open).rwui_expand"); if (expanded.size() \> unexpanded.size()) { expanded.each(function(){ jQuery(this).trigger("click"); jQuery ("#toggleAll").attr("aria-pressed", jQuery (this).attr("aria-pressed") == 'false' ? "true" : "false" ); }) } else { unexpanded.each(function(){ jQuery(this).trigger("click"); jQuery ("#toggleAll").attr("aria-pressed", jQuery (this).attr("aria-pressed") == 'true' ? "false" : "true" ); }) } }); }); \</script\>

So the code I just posted was from a lot of comments in this chat (thank you to all that helped). The expand/collapse button opens and close the expand marco even when one is open and teh other is closed. I commented those two lines out and placed new one that open in close the UI expand marco. the only issue is that if one is open and the other is close it flip flops instead of opening all and then closing all.

Now I dug deep and I found that when your opening and closing the the UI expand the div outside of the element, when open, div class is rwui_expandable_item rw_open. When it is close it is rwui_expandable_item. If anyone can help that would be great. I have been killing my self over this hahahaha


author: Kim Rattray
body: I want to trigger the expand all when Ctrl F is pressed, but I can't get the code to work. What am I doing wrong? Here's what I used in an HTML macro at the bottom of the page:

```
<script type="text/javascript">window.addEventListener("keydown", function(e) {  if (e.keyCode === 114 || (e.ctrlKey && e.keyCode === 70)) {AJS.toInit(function() { $(".expand-control").trigger('keydown');});}})</script>
```


author: Thomas Kramer
body: [@Kim Rattray](/t5/user/viewprofilepage/user-id/2151673) that sounds like a great idea. Unfortunately I can't help, but I would be really interested in the solution if someone knows how to solve!


author: jdeklerk
body: I appreciate that there are some more elaborate solutions already mentioned, but here are my thoughts:

Unclear if this will still help anyone on DC, but the way that we have worked around the out-the-box limitation is to create some user macros containing javascript.

This means all of our users can make use of the macros and it avoids using the HTML macro.

<br />

**Button to toggle expand/collapse all**

```
## @noparams
<button name="toggleAll" id="toggleAll" type="button" class="aui-button aui-button-primary">Expand/Collapse</button>

<script type="text/javascript">
AJS.toInit(function ()
{
AJS.$('#toggleAll').click(function()
{
jQuery(".expand-control").each(function(){ jQuery(this).trigger("click");})
});
});
</script>

```

**Expand all macros by default on page load**

```
## @noparams
<script type="text/javascript">
window.onload = function() {
AJS.$(".expand-container .expand-control").click();
};
</script>
```

This should mean that you can add both macros to a page if you want all expands to start expanded and have the option to collapse them all.

This should also me that an in page search should pick up text in the expanded sections on load.

Obligatory warning that if you have a page with a large amount of data within expands, then using either/both will make the page load a little longer and show a bunch more content.

**Bonus Note:**

It seems that Confluence has no good way of uniquely identifying each Expand macro if it was the case that you wanted to expand some, but not all expand macros.

One of the ways to force this is using something like the HTML macro to define expands manually and then referencing those expands in another macro. For those curious, a rough solution could look like this:

**HTML macro Expands**

Enclose your Expand macro inside an HTML macro

    {html:id=unique1}    {expand}    Your expandable content here    {expand}{html}

**Expanding Macro**

    ## @noparams##<script type="text/javascript">    window.onload = function() {        AJS.$("#unique1 .expand-control").click();        AJS.$("#unique2 .expand-control").click();        .....        AJS.$("#uniquen .expand-control").click();    };</script>

Where you just need to enter the id(s) of the ones you want expanding, e.g. in the HTML macro the id=unique1 and in the Expanding macro we called the #unique1 variable.

To echo the warning of those that came [before](https://community.atlassian.com/t5/Confluence-discussions/implementing-an-quot-expand-all-quot-option-on-your-Confluence/td-p/1132197#U2577794):
> ...
>
> please be aware of the potential security risk you take by enabling the html macro.
>
> A user can enter any html with this macro, maybe harmless, maybe not.
>
> ...
>
> - [Thomas Schlegel](https://community.atlassian.com/t5/user/viewprofilepage/user-id/781483)


author: Ian Mounsey
body: For those who want to use a Browser Bookmarlet.

Step-by-step guide to Create an EXPAND / COLLAPSE Bookmarklet {#toc-hId--438363467}
-----------------------------------------------------------------------------------

Note: This is a once off step.

Make sure you can see your Chrome Bookmarks Bar. Keyboard shortcut: CONTROL+SHIFT+"B"

1. Using the keyboard shortcut CONTROL+SHIFT+"O" open the Bookmark Manager
2. Click on the 3 vertical dots (to the right of the search bar at the top of the page)
3. Click on "Add new bookmark"
4. Copy the following javascript and paste it into the URL area:  

   **javascript\&colon;(function()%7B%24(".expand-control").each(function()%7B %24(this).trigger("click")%3B%7D)%7D)()**
5. Give it a name: eg "EXPAND"
6. This bookmarklet will now be in your list of bookmarks. Using the Bookmarks Manager, you can move this Bookmarklet to the top of the page so that it is visible on your browser at all times.

comments: author: ????????? ????????
body: Brilliant! It works!


author: Rob Powers
body: If you can edit the page then you can search the content without the need for any macro.


author: Timothy Chen
body: Documention for toggle all - not a macro, but a javscript solution.

[](https://confluence.atlassian.com/display/DOC/Expand+Macro?focusedCommentId=452100227#comment-452100227)<https://confluence.atlassian.com/display/DOC/Expand+Macro?focusedCommentId=452100227#comment-452100227>


author: Chung Park Chan
body: Maybe this can help?

<http://www.adaptavist.com/display/AtlassianConfluence/cloak+macro>

comments: author: Timothy Chen
body: Thanks for that Chung, however this seems different from the usual {expand} macro that comes with confluence. Do you know how to do the same thing with the {expand} macro?


author: Chung Park Chan
body: I don't think so you can do so. IMO, the expand macro is used to expand 'part by part' - if you want to choose to expand all, you can put all information into one single expand (that defeats its purpose).


author: Timothy Chen
body: Yep I think you are right, that would defeat the purpose.  
So in summary, I definitely cannot create my own user macro to do this?


Tags: expand