Editing Template:Spoiler/doc (section)

===Show/Hide all spoilers button===
A "show/hide all spoilers" button can be placed anywhere on the page and does what it says. Showing and hiding spoilers with this button preserves the spoilers you have previously manually revealed. (i.e. If you click to reveal a spoiler, then click "show all spoilers", then "hide all spoilers", the spoilers you revealed at first will stay revealed.)

Adding <code>id="spoilerbtn"</code> to any element will turn it into the "show/hide" button.
{| class="wikitable" width=100%
!width=50%|What you type
!Result
|-
|<pre>
<div id="spoilerbtn"></div>
</pre>
|<div id="spoilerbtn">Show all spoilers</div>
|-
|'''Note:''' This element being empty is intentional! The javascript handles putting the "show all spoilers"/"hide all spoilers" text. If any text is in this element, it will be overwritten when the javascript loads anyway. As such, it ''is'' possible to put error text there, that only shows when the javascript doesn't load, like this:
<pre>
<div id="spoilerbtn">If you're seeing this text, the javascript isn't loaded.</div>
</pre>
|This button does nothing on this page as the required javascript cannot be loaded. This is what the "hide all spoilers" button looks like, for reference:<br>

<div id="spoilerbtn" class="hide">Hide all spoilers</div>
|}
All these colors can be changed with css.