Wechseln zu:Navigation, Suche
Wiki

Vorlage:Einblenden/Doku: Unterschied zwischen den Versionen

Aus Securepoint Wiki
← Zum vorherigen Versionsunterschied
Keine Bearbeitungszusammenfassung
Keine Bearbeitungszusammenfassung
 
Zeile 3: Zeile 3:
<p>'''Am Ende des ausklappbaren Abschnitts müssen unbedingt <u>zwei</u> div-Tags <u>und</u> ein span-Tag <nowiki></div></div></span></nowiki> eingefügt werden!'''</p>
<p>'''Am Ende des ausklappbaren Abschnitts müssen unbedingt <u>zwei</u> div-Tags <u>und</u> ein span-Tag <nowiki></div></div></span></nowiki> eingefügt werden!'''</p>
{| class="wikitable"
{| class="wikitable"
! Parameter !! Default !! Beschreibung
! Parameter !! Wert !! Code / Beschreibung !! Darstellung
|-
|-
| |'''| 1''' <br><small>''| ausklappen=''</small><br><small>''| einblenden=''</small> || ausklappen <br><nowiki>{{Einblenden| zeig| weg damit}}Darum geht's</div></div></nowiki>
| |'''| 1''' <br><small>''| ausklappen=''</small><br><small>''| einblenden=''</small> || <i class=default></i> ausklappen || <nowiki>{{Einblenden}}Darum geht's</div></div></span></nowiki> || {{Einblenden}}Darum geht's</div></div></span>
|| {{Einblenden| zeig| weg damit}}Darum geht's</div></div>
|-
| |'''| 2''' <br><small>''| einklappen=''</small> <br><small>''| ausblenden=''</small> || <i class=default></i> einklappen || <nowiki>{{Einblenden|collapsed=false}}Darum geht's</div></div></span></nowiki> || {{Einblenden| collapsed=false}}Darum geht's</div></div></span>
|-
| |'''| 3''' <br><small>''| collapsed=''</small> || true || true: Text ausgeblendet (Default-Zustand)<br>false: Text eingeblendet <p>''<nowiki>{{Einblenden| zeig| weg damit | false }}Sofort sichtbar</div></div></span></nowiki>''</p> || {{Einblenden| zeig| weg damit | false}}Sofort sichtbar</div></div></span>
|-
| rowspan="3" | '''| 4''' <br><small>''| layout=''</small> || dezent || <nowiki>{{Einblenden| zeig| weg damit | false | dezent }}Layout ''Dezent''</div></div></span></nowiki> || {{Einblenden| zeig| weg damit | false | dezent }}Layout ''Dezent''</div></div></span>
|-
|| bigdezent || <nowiki>{{Einblenden| zeig| weg damit | false | bigdezent }}Layout ''bigdezent''</div></div></span></nowiki> || {{Einblenden| zeig| weg damit | false | bigdezent }}Layout ''bigdezent''</div></div></span>


|-
|-
| |'''| 2''' <br><small>''| einklappen=''</small> <br><small>''| ausblenden=''</small> || einklappen || {{Einblenden| zeig| weg damit|false}}Darum gehts</div></div>
|| tolltip || Zeigt den Inhalt bereits beim Hovern als schwebendes Fesnter an. Klicken trotzdem möglich. Erlaubt umfangreiches HTML-Layout als Hovertext.<nowiki>{{Einblenden| zeig| weg damit | true | dezent tolltip}}Layout ''dezent tolltip''</div></div></span></nowiki> || {{Einblenden| zeig| weg damit |true | dezent tolltip }}Layout ''dezent tolltip''</div></div></span>
 
|-
|-
| |'''| 3''' <br><small>''| collapsed=''</small> || true || true: Text ausgeblendet (Default-Zustand)<br>false: Text eingeblendet
| rowspan=8 | '''| icon=''' || info || <nowiki>{{Einblenden| layout=dezent | icon=info}}''info''</div></div></span></nowiki> || {{Einblenden| layout=dezent | icon=info }}''info''</div></div></span>
|-
|-
| |'''| 4''' <br><small>''| layout=''</small> || || <pre>layout=dezent</pre> → <div class="dezent"><div class="mw-collapsible-toggle">dezente Darstellung</div></div>
| lightbulb || <nowiki>{{Einblenden| layout=dezent | icon=lightbulb}}''lightbulb''</div></div></span></nowiki> || {{Einblenden| layout=dezent | icon=lightbulb }}''lightbulb''</div></div></span>
|-
| thinking || <nowiki>{{Einblenden| layout=dezent | icon=thinking}}''thinking''</div></div></span></nowiki> || {{Einblenden| layout=dezent | icon=thinking }}''thinking''</div></div></span>
|-
| code || <nowiki>{{Einblenden| layout=dezent | icon=code}}''code''</div></div></span></nowiki> || {{Einblenden| layout=dezent | icon=code }}''code''</div></div></span>
|-
| gear || <nowiki>{{Einblenden| layout=dezent | icon=gear}}''gear''</div></div></span></nowiki> || {{Einblenden| layout=dezent | icon=gear }}''gear''</div></div></span>
|-
| bug || style="vertical-align: bottom;" | Funktioniert zwar, sollte aber nur mit der Vorlage <nowiki>{{info|…}}</nowiki> verwendet werden<br><nowiki>{{Einblenden| layout=dezent | icon=bug}}''bug''</div></div></span></nowiki> || {{Einblenden| layout=dezent | icon=bug | collapsed=false}}''bug''</div></div></span>
|-
| menu || <u>Nur für Startseiten</u> oder für die <u>Vorlage <nowiki>{{info|…}}</nowiki></u>
| class=startbox-demo | {{Einblenden| layout=dezent | icon=menu }}''menu''</div></div></span>
|-
| changelog || Wird in der Vorlage <nowiki>{{Header | vorher=…}}</nowiki> verwendet<br> || {{Einblenden| Vorhergehende Änderungen… | layout=dezent | icon=changelog }}''changelog''</div></div></span>
 
|-
|-
| |'''| id''' || ''Null'' || {{code|<nowiki>id=2</nowiki>}} → <nowiki>id="mw-customcollapsible-Inhalte2"</nowiki><br>Um den Bereich, der eingeblendet oder ausgeblendet werden soll eindeutig zu identifizieren wird das tag ''<nowiki>id="mw-customcollapsible-Inhalte"</nowiki>'' verwendet.<br>Soll nun ein ausklappbarer Bereich verschachtelt werden, muss der zweite Bereich mit ''<nowiki>id="mw-customcollapsible-Inhalte2"</nowiki>'' getagt werden. Das verhindert ein ungewolltes einblenden der Verschachtelung.
| |'''| id''' || ''Null'' || {{code|<nowiki>id=2</nowiki>}} → <nowiki>id="mw-customcollapsible-Inhalte2"</nowiki><br>Um den Bereich, der eingeblendet oder ausgeblendet werden soll eindeutig zu identifizieren wird das tag ''<nowiki>id="mw-customcollapsible-Inhalte"</nowiki>'' verwendet.<br>Soll nun ein ausklappbarer Bereich verschachtelt werden, muss der zweite Bereich mit ''<nowiki>id="mw-customcollapsible-Inhalte2"</nowiki>'' getagt werden. Das verhindert ein ungewolltes Einblenden der Verschachtelung. ||
|-
|-
| |'''| Vorschau'''=  || || blendet ein Vorschaubildchen rechts vom Toggle-Text ein.  
| |'''| Vorschau'''=  || || blendet ein Vorschaubildchen rechts vom Toggle-Text ein.  
* table-check.png <span class="Vorschaubild">[[Datei:table-check.png]]</span>
* table-check.png <span class="Vorschaubild">[[Datei:table-check.png]]</span>
* step-by-step.png <span class="Vorschaubild">[[Datei:step-by-step.png]]</span>
* step-by-step.png <span class="Vorschaubild">[[Datei:step-by-step.png]]</span>
* Step-by-Step-2025.png <span class="Vorschaubild">[[Datei:Step-by-Step-2025.png]]</span>
* Step-by-Step-2025-2.png <span class="Vorschaubild">[[Datei:Step-by-Step-2025-2.png]]</span>
| {{Einblenden| zeig| weg damit | true | dezent | Vorschau=table-check.png }} Tabelle </div></div></span>
<br><br> {{Einblenden| zeig| weg damit | true | dezent | Vorschau=step-by-step.png }} Schritt für Schritt </div></div></span>
<br><br> {{Einblenden| zeig| weg damit | true | dezent | Vorschau=Step-by-Step-2025.png }} Schritt für Schritt 2025 </div></div></span>
<br><br> {{Einblenden| zeig| weg damit | true | dezent | Vorschau=Step-by-Step-2025-2.png }} Schritt für Schritt 2025-2 </div></div></span>
|-
|-
| |'''| class-content=''' ||  || css Klasse, die auf den Contentbereich wirkt.<br> z.B.: ''grid'' um Text neben großen Bildern anzeigen zu lassen
| |'''| class-content=''' ||  || css Klasse, die auf den Contentbereich wirkt.<br> z.B.: ''grid'' um Text neben großen Bildern anzeigen zu lassen

Aktuelle Version vom 21. Januar 2026, 14:10 Uhr

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>
Darum geht's
| 2
| einklappen=
| ausblenden=		 einklappen {{Einblenden|collapsed=false}}Darum geht's</div></div></span>
Darum geht's
| 3
| collapsed=		 true true: Text ausgeblendet (Default-Zustand)
false: Text eingeblendet

{{Einblenden| zeig| weg damit | false }}Sofort sichtbar</div></div></span>
Sofort sichtbar
| 4
| layout=		 dezent {{Einblenden| zeig| weg damit | false | dezent }}Layout ''Dezent''</div></div></span>
Layout Dezent
bigdezent {{Einblenden| zeig| weg damit | false | bigdezent }}Layout ''bigdezent''</div></div></span>
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>
Layout dezent tolltip
| icon= info {{Einblenden| layout=dezent | icon=info}}''info''</div></div></span>
info
lightbulb {{Einblenden| layout=dezent | icon=lightbulb}}''lightbulb''</div></div></span>
lightbulb
thinking {{Einblenden| layout=dezent | icon=thinking}}''thinking''</div></div></span>
thinking
code {{Einblenden| layout=dezent | icon=code}}''code''</div></div></span>
code
gear {{Einblenden| layout=dezent | icon=gear}}''gear''</div></div></span>
gear
bug Funktioniert zwar, sollte aber nur mit der Vorlage {{info|…}} verwendet werden
{{Einblenden| layout=dezent | icon=bug}}''bug''</div></div></span>
bug
menu Nur für Startseiten oder für die Vorlage {{info|…}}
changelog Wird in der Vorlage {{Header | vorher=…}} verwendet
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.





1. 2. 3.
Abb.1 Abb.2 Abb.3
Abbildungen
Tabelle






1. 2. 3.
Abb.1 Abb.2 Abb.3
Abbildungen
Schritt für Schritt






1. 2. 3.
Abb.1 Abb.2 Abb.3
Abbildungen
Schritt für Schritt 2025






1. 2. 3.
Abb.1 Abb.2 Abb.3
Abbildungen
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
Abgerufen von „https://wiki.securepoint.de/index.php?title=Vorlage:Einblenden/Doku&oldid=100323“