KKeine Bearbeitungszusammenfassung |
KKeine Bearbeitungszusammenfassung |
||
| Zeile 2: | Zeile 2: | ||
class="mw-collapsible {{#ifeq: {{{3|{{{collapsed|true}}} }}}|false| | {{#if:||{{{3|}}}}} {{#ifeq: {{{4|}}}|false||mw-collapsed}} {{{4|}}} }}" | class="mw-collapsible {{#ifeq: {{{3|{{{collapsed|true}}} }}}|false| | {{#if:||{{{3|}}}}} {{#ifeq: {{{4|}}}|false||mw-collapsed}} {{{4|}}} }}" | ||
data-expandtext="{{{1|{{{einblenden|{{{ausklappen|ausklappen}}} }}} }}}" | data-expandtext="{{{1|{{{einblenden|{{{ausklappen|ausklappen}}} }}} }}}" | ||
data-collapsetext=" | data-collapsetext="text zum <u>ein</u>blenden" | ||
id="mw-customcollapsible-Inhalte" | id="mw-customcollapsible-Inhalte" | ||
></span><div class="mw-collapsible-content"></includeonly><noinclude> | ></span><div class="mw-collapsible-content"></includeonly><noinclude> | ||
{{Dokumentation}} | {{Dokumentation}} | ||
</noinclude> | </noinclude> | ||
Version vom 11. Mai 2020, 10:15 Uhr
Syntax: {{ Einblenden | Zeig | weg damit | true | dezent}} […] </div></div></span>
Um Textabschnitte ein- und ausblenden zu können wird die Klasse mw-collapsible verwendet.
Die nicht eben intuitiven Parameter werden hier eingängig übersetzt.
Am Ende des ausklappbaren Abschnitts müssen unbedingt zwei div-Tags und ein span-Tag </div></div></span> eingefügt werden!
| Parameter | Wert | Code / Beschreibung | Darstellung |
|---|---|---|---|
| | 1 | ausklappen= | einblenden= |
ausklappen | {{Einblenden}}Darum geht's</div></div></span> | <div
class="mw-collapsible mw-collapsed" data-expandtext="ausklappen " data-collapsetext="text zum einblenden" id="mw-customcollapsible-Inhalte" >Darum geht's
|
| | 2 | einklappen= | ausblenden= |
einklappen | {{Einblenden|collapsed=false}}Darum geht's</div></div></span> | <div
class="mw-collapsible " data-expandtext="ausklappen " data-collapsetext="text zum einblenden" id="mw-customcollapsible-Inhalte" >Darum geht's
|
| | 3 | collapsed= |
true | true: Text ausgeblendet (Default-Zustand) false: Text eingeblendet {{Einblenden| zeig| weg damit | false }}Sofort sichtbar</div></div></span> |
<div
class="mw-collapsible " data-expandtext=" zeig" data-collapsetext="text zum einblenden" id="mw-customcollapsible-Inhalte" >Sofort sichtbar
|
| | 4 | layout= |
dezent | {{Einblenden| zeig| weg damit | false | dezent }}Layout ''Dezent''</div></div></span> | <div
class="mw-collapsible " data-expandtext=" zeig" data-collapsetext="text zum einblenden" id="mw-customcollapsible-Inhalte" >Layout Dezent
|
| bigdezent | {{Einblenden| zeig| weg damit | false | bigdezent }}Layout ''bigdezent''</div></div></span> | <div
class="mw-collapsible " data-expandtext=" zeig" data-collapsetext="text zum einblenden" id="mw-customcollapsible-Inhalte" >Layout bigdezent
| |
| tolltip | Zeigt den Inhalt bereits beim Hovern als schwebendes Fesnter an. Klicken trotzdem möglich. Erlaubt umfangreiches HTML-Layout als Hovertext.{{Einblenden| zeig| weg damit | true | dezent tolltip}}Layout ''dezent tolltip''</div></div></span> | <div
class="mw-collapsible true mw-collapsed dezent tolltip" data-expandtext=" zeig" data-collapsetext="text zum einblenden" id="mw-customcollapsible-Inhalte" >Layout dezent tolltip
| |
| | icon= | info | {{Einblenden| layout=dezent | icon=info}}''info''</div></div></span> | info<div
class="mw-collapsible mw-collapsed" data-expandtext="ausklappen " data-collapsetext="text zum einblenden" id="mw-customcollapsible-Inhalte" >info
|
| lightbulb | {{Einblenden| layout=dezent | icon=lightbulb}}''lightbulb''</div></div></span> | lightbulb<div
class="mw-collapsible mw-collapsed" data-expandtext="ausklappen " data-collapsetext="text zum einblenden" id="mw-customcollapsible-Inhalte" >lightbulb
| |
| thinking | {{Einblenden| layout=dezent | icon=thinking}}''thinking''</div></div></span> | thinking<div
class="mw-collapsible mw-collapsed" data-expandtext="ausklappen " data-collapsetext="text zum einblenden" id="mw-customcollapsible-Inhalte" >thinking
| |
| code | {{Einblenden| layout=dezent | icon=code}}''code''</div></div></span> | code<div
class="mw-collapsible mw-collapsed" data-expandtext="ausklappen " data-collapsetext="text zum einblenden" id="mw-customcollapsible-Inhalte" >code
| |
| gear | {{Einblenden| layout=dezent | icon=gear}}''gear''</div></div></span> | gear<div
class="mw-collapsible mw-collapsed" data-expandtext="ausklappen " data-collapsetext="text zum einblenden" id="mw-customcollapsible-Inhalte" >gear
| |
| bug | Funktioniert zwar, sollte aber nur mit der Vorlage {{info|…}} verwendet werden {{Einblenden| layout=dezent | icon=bug}}''bug''</div></div></span> |
bug<div
class="mw-collapsible " data-expandtext="ausklappen " data-collapsetext="text zum einblenden" id="mw-customcollapsible-Inhalte" >bug
| |
| menu | Nur für Startseiten oder für die Vorlage {{info|…}} | menu<div
class="mw-collapsible mw-collapsed" data-expandtext="ausklappen " data-collapsetext="text zum einblenden" id="mw-customcollapsible-Inhalte" >menu
| |
| changelog | Wird in der Vorlage {{Header | vorher=…}} verwendet |
changelog<div
class="mw-collapsible mw-collapsed" data-expandtext=" Vorhergehende Änderungen… " data-collapsetext="text zum einblenden" id="mw-customcollapsible-Inhalte" >changelog
| |
| | id | Null | id=2 → id="mw-customcollapsible-Inhalte2" Um den Bereich, der eingeblendet oder ausgeblendet werden soll eindeutig zu identifizieren wird das tag id="mw-customcollapsible-Inhalte" verwendet. Soll nun ein ausklappbarer Bereich verschachtelt werden, muss der zweite Bereich mit id="mw-customcollapsible-Inhalte2" getagt werden. Das verhindert ein ungewolltes Einblenden der Verschachtelung. |
|
| | Vorschau= | blendet ein Vorschaubildchen rechts vom Toggle-Text ein.
|
<div
class="mw-collapsible true mw-collapsed dezent" data-expandtext=" zeig" data-collapsetext="text zum einblenden" id="mw-customcollapsible-Inhalte" > Tabelle
Schritt für Schritt
Schritt für Schritt 2025
Schritt für Schritt 2025-2
| |
| | class-content= | css Klasse, die auf den Contentbereich wirkt. z.B.: grid um Text neben großen Bildern anzeigen zu lassen | ||
| | css= | beliebiges css, das auf die Vorlage wirkt |
|
|