Collapse and expand wiki page content

This page contains notes on using MediaWiki features that allow you to collapse and expand content sections.

MediaWiki default capabilities

For a block that starts collapsed:

<div class="mw-collapsible mw-collapsed">
<div class="mw-collapsible-content">
This content is hidden initially.

You can put normal wikitext here:
* Item one
* Item two
* Item three
</div>
</div>

mw-collapsible makes the element collapsible, while mw-collapsed makes it start collapsed. MediaWiki then supplies the Expand/Collapse control. MediaWiki

For something more useful, with a visible title:

<div class="mw-collapsible mw-collapsed">
My additional information
<div class="mw-collapsible-content">
Here is all of the additional information that I don't
want displayed until the reader expands it.

* Item one
* Item two
* Item three
</div>
</div>

You can also change the words used for the control:

Additional information
<div class="mw-collapsible-content">
This is the hidden content.
</div>
</div>

That functionality is built into MediaWiki's jquery.makeCollapsible module. MediaWiki

MediaWiki Details extension

There is now an Extension:Details extension that I think is particularly worth considering for your personal wiki. It lets you write:

<details>
<summary>My additional information</summary>

Here is the information.

* Item one
* Item two
* Item three

</details>

The result behaves like the familiar disclosure/accordion control on modern websites: click the summary and the content opens underneath it.

You can also make it initially open:

<details open>
<summary>My additional information</summary>

Content here.

</details>

The Details extension is currently marked stable, supports MediaWiki 1.39+, and uses the browser's semantic <details>/<summary> mechanism. One advantage is that browsers understand the hidden material as actual page content; things such as links to anchors and Find-in-Page can interact with it more intelligently. MediaWiki

Installation is simply:

wfLoadExtension( 'Details' );

after putting the extension in the extensions/Details directory. MediaWiki

MediaWiki CollapsibleSections extension

CollapsibleSections can make entire MediaWiki sections collapsible, which is useful if you want something like:

=== Travel Plans ===

Lots of content...

=== Books to Read ===

Lots more content...

and want each section to collapse from its heading. It can be configured for desktop use and whether sections start collapsed. MediaWiki

MediaWiki Spoilers extension

Provides {{#spoiler:...}} https://www.mediawiki.org/wiki/Extension%3ASpoilers?utm_source=chatgpt.com

Its purpose is specifically hiding spoiler-like content. MediaWiki

MediaWiki custom template

One other possibility is creating your own {{Collapse}} template around MediaWiki's built-in functionality. MediaWiki.org itself has a Collapse template with parameters such as title, content, background, alignment, and initial state. MediaWiki