Editing Template:DateALive:Toggle (section)

===Add an arc===
To make a new hide/unhide trigger, wrap these pieces of code around whatever's supposed to be clicked: <code style="background:#dcdcc6"><nowiki><</nowiki>div class="mw-customtoggle-ArcX mw-customtoggle-ArcXClose mw-customtoggle-ArcXOpen" style="background:#9e6c38;cursor:pointer;height:20px;padding-top:3px" align="center"></code> and <code style="background:#dcdcc6"><nowiki><</nowiki>/div></code>. The <code style="background:#dcdcc6">ArcX</code> is the declared name of the object, and should be replaced with whatever's most appropriate ("Arc10", "Comiket", etc.).

Then, add the piece of string referring to the new arc (<code style="background:#dcdcc6">mw-customtoggle-ArcX mw-customtoggle-ArcXClose mw-customtoggle-ArcXOpen</code>) to the master toggle on this page, twice in total: once after the <code style="background:#dcdcc6"><div class="</code> for the all-sections-toggle trigger and once after the <code style="background:#dcdcc6"><div class="</code> for the main-story- or side-stories-sections-toggle trigger. Remember to replace the all six <code style="background:#dcdcc6">ArcX</code> in here too.

Finally, wrap <code style="background:#dcdcc6"><nowiki><</nowiki>div class="mw-collapsible" style="text-align:left;margin:5px5pxclear:both;font-size:100%;background:transparent;width:100%;" id="mw-customcollapsible-ArcX"></code> and <code style="background:#dcdcc6"><nowiki><</nowiki>br style="clear:both"/></div></code> around the stuff you want to hide and unhide. Again, that little text <code style="background:#dcdcc6">ArcX</code> is the name you're assigning for the purpose of customtoggle.

For example:
<pre>
<div class="mw-customtoggle-ArcX mw-customtoggle-ArcXClose mw-customtoggle-ArcXOpen" style="background:#9e6c38;cursor:pointer;height:20px;padding-top:3px" align="center"><big>'''Volume X'''</big></div>

<div class="mw-collapsible" style="text-align:left;margin:5px5pxclear:both;font-size:100%;background:transparent;width:100%;"
id="mw-customcollapsible-ArcX">
[[File:DAL_v01_cover.jpg|thumb|x180px]]
===Volume X - Dead End Tohka===
::*[[Date A Live:Volume 1 Illustrations|Novel Illustrations]]
::*[[Date A Live:Volume 1 Prologue|Prologue: Chance Meeting -restart-]]
::*[[Date A Live:Volume 1 Chapter 1|Chapter 1: The Nameless Girl]]
::*[[Date A Live:Volume 1 Chapter 2|Chapter 2: {{Furigana|Training|Game}} Start]]
::*[[Date A Live:Volume 1 Chapter 3|Chapter 3: Your Name Is......]]
::*[[Date A Live:Volume 1 Chapter 4|Chapter 4: Surprise Date]]
::*[[Date A Live:Volume 1 Chapter 5|Chapter 5: Ruthless {{Furigana|Slaughterer|Sandalphon}}]]
::*[[Date A Live:Volume 1 Epilogue|Epilogue: Life With a Spirit]]
::*[[Date A Live:Volume 1 Afterword|Afterword]]
<br style="clear:both"/>
</div>
</pre>


Tip: If you add <code style="background:#dcdcc6">mw-collapsed</code> in the class of the second div (after <code style="background:#dcdcc6">mw-collapsible</code>), you'll make the open/hide trigger closed by default.

For example:
<pre>
<div class="mw-customtoggle-ArcX mw-customtoggle-ArcXClose mw-customtoggle-ArcXOpen" style="background:#9e6c38;cursor:pointer;height:20px;padding-top:3px" align="center"><big>'''Volume X'''</big></div>

<div class="mw-collapsible mw-collapsed" style="text-align:left;margin:5px5pxclear:both;font-size:100%;background:transparent;width:100%;"
id="mw-customcollapsible-ArcX">
[[File:DAL_v01_cover.jpg|thumb|x180px]]
===Volume X - Dead End Tohka===
::*[[Date A Live:Volume 1 Illustrations|Novel Illustrations]]
::*[[Date A Live:Volume 1 Prologue|Prologue: Chance Meeting -restart-]]
::*[[Date A Live:Volume 1 Chapter 1|Chapter 1: The Nameless Girl]]
::*[[Date A Live:Volume 1 Chapter 2|Chapter 2: {{Furigana|Training|Game}} Start]]
::*[[Date A Live:Volume 1 Chapter 3|Chapter 3: Your Name Is......]]
::*[[Date A Live:Volume 1 Chapter 4|Chapter 4: Surprise Date]]
::*[[Date A Live:Volume 1 Chapter 5|Chapter 5: Ruthless {{Furigana|Slaughterer|Sandalphon}}]]
::*[[Date A Live:Volume 1 Epilogue|Epilogue: Life With a Spirit]]
::*[[Date A Live:Volume 1 Afterword|Afterword]]
<br style="clear:both"/>
</div>
</pre>

<small>(Note: the <code style="background:#dcdcc6"><nowiki><</nowiki>br style="clear:both"/></code> shouldn't be that important - it's only giving a type of line break, I think, which shouldn't actually be part of the hiding process. On the other hand, I have no idea where the user's manual for the customtoggle is so for all I know it's a mandatory part of the function. Unless someone who knows for sure comes along and deletes my comment, include it just to be on the safe side.)</small>