Template:Show: Difference between revisions

Content deleted Content added

Inline

Latest revision as of 17:51, 21 December 2025

Usage

A simple collapsible block for hiding/showing content.

{{show
|text=The primary driver for the acquisition was the target's proprietary AI technology.
}}

Custom Labels

To change the "more" and "less" buttons:

{{show
|expandtext=Read Bio
|collapsetext=Close
|text=John Doe has been the CEO since 2010...
}}

Parameters

text: The content to be hidden/shown.
expandtext: The text for the "show" link (Defaults to "more ▾").
collapsetext: The text for the "hide" link (Defaults to "less ▴").
state: Set to "expanded" to have the text visible on page load.
style: Pass additional CSS styles directly to the container.

@@ Line 1: / Line 1: @@
-<includeonly><{{#ifeq:{{{inline|}}}|yes|span|div}} class="mw-collapsible {{#ifeq:{{lc:{{{state|collapsed}}}}}|expanded||mw-collapsed}} {{#ifeq:{{{compact|}}}|yes|mw-compact-toggle|}}"
+<includeonly><div class="mw-collapsible {{#ifeq:{{lc:{{{state|collapsed}}}}}|expanded||mw-collapsed}}"
+data-expandtext="{{{expandtext|more ▾}}}"
-style="{{#ifeq:{{{inline|}}}|yes|display:inline;}}{{#ifeq:{{{compact|}}}|yes|display:inline;}} {{{style|}}}">
+data-collapsetext="{{{collapsetext|less ▴}}}"
-{{#ifeq:{{{compact|}}}|yes|
+style="{{{style|}}}">
+<div class="mw-collapsible-content">
-  <span class="mw-collapsible-toggle mw-compact-show" style="cursor:pointer; color:#0645ad;" role="button" tabindex="0">{{{expandtext|more ▾}}}</span>
-|}}
-<{{#ifeq:{{{inline|}}}|yes|span|div}} class="mw-collapsible-content" style="{{#ifeq:{{{inline|}}}|yes|display:inline;}}">
 {{{text|}}}
+</div>
-{{#ifeq:{{{compact|}}}|yes|
+</div></includeonly><noinclude>
-  &nbsp;<span class="mw-collapsible-toggle mw-compact-hide" style="cursor:pointer; color:#0645ad;" role="button" tabindex="0">{{{collapsetext|less ▴}}}</span>
+== Usage ==
-|}}
+A simple collapsible block for hiding/showing content.
-</{{#ifeq:{{{inline|}}}|yes|span|div}}>
-</{{#ifeq:{{{inline|}}}|yes|span|div}}></includeonly><noinclude>
-== Usage ==
-Standard block usage (floats toggle to the far right):
 <pre>
 {{show
@@ Line 22: / Line 16: @@
 </pre>
-== Compact Usage ==
+== Custom Labels ==
+To change the "more" and "less" buttons:
-This version keeps the link inline at the natural end of the text.
 <pre>
 {{show
+|expandtext=Read Bio
-|compact=yes
+|collapsetext=Close
-|text=This text is short and the button stays close and aligned.
+|text=John Doe has been the CEO since 2010...
 }}
 </pre>
@@ Line 35: / Line 30: @@
 * '''expandtext''': The text for the "show" link (Defaults to "more ▾").
 * '''collapsetext''': The text for the "hide" link (Defaults to "less ▴").
-* '''inline''': Set to "yes" to use span tags.
-* '''compact''': Set to "yes" to use the inline run-in toggle style.
 * '''state''': Set to "expanded" to have the text visible on page load.
-* '''style''': Pass additional CSS styles directly.
+* '''style''': Pass additional CSS styles directly to the container.
+[[Category:Generic templates]]
-== Required CSS ==
-Add this to your [[MediaWiki:Common.css]]:
-<pre>
-/* Compact Toggle Logic */
-/* 1. When expanded, hide the 'Show' link */
-.mw-collapsible:not(.mw-collapsed) .mw-compact-show {
-    display: none !important;
-}
-/* 2. When collapsed, the 'Hide' link is naturally hidden because
-      its parent (.mw-collapsible-content) is hidden by MW default CSS. */
-/* Optional: Ensure pointer cursor if inline styles are stripped */
-.mw-compact-show, .mw-compact-hide {
-    cursor: pointer;
-}
-</pre>
 </noinclude>