Vorlage:Box

{{{1}}}

{{{2}}}

Für das einheitliche Hervorheben von ähnlichen Inhalten soll die Vorlage "Box" verwendet werden.

Beispiel

Das schreibt man:

{{Box|Hier ist die Überschrift|Hier steht der Inhalt, der in der Box angezeigt wird.|Merksatz}}

Man kann zur besseren Übersichtlichkeit auch Zeilenumbrüche einfügen:

{{Box|Hier ist die Überschrift|

Hier steht der Inhalt, der in der Box angezeigt wird.

|Merksatz}}

Das sieht man:

Hier ist die Überschrift

Hier steht der Inhalt, der in der Box angezeigt wird.

Vorlagen für Boxen

Für das einheitliche Hervorheben von ähnlichen Inhalten soll möglichst die Vorlage "Box" verwendet werden. Mehr Infos dazu findet man auf der Seite Vorlage:Box.

Verkürzt wird die Vorlage so verwendet:

{{Box|<Überschrift>|<Inhalt>|<Klasse>}}

• Die Überschrift (nach {{Box| und vor dem nächsten |) ist frei wählbar.
• Die Klasse gibt an, welche Farbe und welches Icon verwendet wird. Als Klassen stehen folgende Varianten zur Verfügung:

Hervorhebung 1

{{Box|Hervorhebung1|...| Hervorhebung1}}

Hervorhebung1

...

Hervorhebung 2

{{Box|Hervorhebung2|...|Hervorhebung2}}

Hervorhebung2

...

Üben

{{Box|Üben|...|Üben}}

Üben

...

Zitat

{{Box|Zitat|....|Zitat}}

Zitat

....

Arbeitsmethode

{{Box|Arbeitsmethode|...|Arbeitsmethode}}

Arbeitsmethode

...

Unterrichtsidee

{{Box|Idee|...|Unterrichtsidee }}

Idee

...

Meinung

{{Box|Meinung|...|Meinung}}

Meinung

...

Lernpfad

{{Box|Lernpfad|...|Lernpfad}}

Lernpfad

...

Lösung

{{Box|Lösung|...|Lösung}}

Lösung

...

Merksatz

{{Box|Merke|...|Merksatz}}

Merke

...

Kurzinfo

{{Box|Info|...|Kurzinfo}}

Info

...

Experimentieren

{{Box|Experiment|...|Experimentieren}}

Experiment

...

Download

{{Box|Download|mit (möglichst internen) Links zu herunterladbarem Material|Download}}

Download

mit (möglichst internen) Links zu herunterladbarem Material

Frage

{{Box|Frage|mit einer Frage|Frage}}

Frage

mit einer Frage

Mögliche Probleme

Es gibt verschiedene Gründe, warum das Box_Design nicht richtig verwendet wird.

= das Gleichheitszeichen

Tritt vor allem in Links auf. Wenn der ein solches Zeichen im Text auftaucht so muss der passende Parameter für die Box explizit benannt werden. Die Parameter für die Box Vorlage sind durchnummeriert, heißen also dementsprechend 1, 2 oder 3

Folgende beiden Varianten sind im Ergebnis identisch. Die benannte Variante kann allerdings auch das = im Text enthalten.

Normale Box Syntax

{{Box | Überschrift | Inhalt | Klasse }}

benannte Box Syntax

{{Box|1=<Überschrift>|2=<Inhalt>|3=<Klasse>}}

Tabellen

Weiterhin machen Tabellen in dem Inhalt ein Problem. Bei diesem und allen anderen Problemen gibt es eine alternative Möglichkeit, wie man diese "Box" erzeugen kann.

Wenn möglich sollte man auf die Verwendung von Tabellen verzichten. Falls das nicht möglich ist gibt es einige Vorlagen die man für Tabellen innerhalb einer Box verwenden kann. Es ist darauf zu achten, dass die Zeichen (Vorlagen) für die Tabellenerstellung jeweils am Anfang einer Zeile stehen.

Tabellensyntaxersetzungen innerhalb von Boxen (oder anderen Templates)

	Wikisyntax	Ersetzung innerhalb einer Box
Tabellenbeginn	{|	{{(!}}
Tabellenüberschrift	|+	{{!+}}
Zeilenbeginn	|-	{{!-}}
Zellenbeginn	|	{{!}}
Zelle mit Zusatzsyntax	|colspan=2|	{{!}}colspan=2{{!}}
Überschriftenzelle	!	! (keine Ersetzung notwendig)
Tabellenende	|}	{{!)}}

Vergleich der Tabellensyntaxelemente

Ergebnis

Zeile 1 / Spalte A	Zeile 1 / Spalte B
Zeile 2 / Spalte A	Zeile 2 / Spalte B

Normale Tabellensyntax

{| class=wikitable
|-
| Zeile 1 / Spalte A
| Zeile 1 / Spalte B
|-
| Zeile 2 / Spalte A
| Zeile 2 / Spalte B
|}

Tabellensyntax innerhalb einer Box

{{(!}} class=wikitable
{{!-}}
{{!}} Zeile 1 / Spalte A 
{{!}} Zeile 1 / Spalte B
{{!-}}
{{!}} Zeile 2 / Spalte A 
{{!}} Zeile 2 / Spalte B
{{!)}}

Hier ein komplizierteres Beispiel:

Eine Tabellenüberschrift

	Spaltenkopf A	Spaltenkopf B
Zeilenkopf	Zeile 1 / Spalte A	Zeile 1 / Spalte B
	Zeile 2 / Spalte A	Zeile 2 / Spalte B
	Zeile 3 / Spalte A und B

Und hier der zugehörige Quelltext für die Tabelle innerhalb einer Box (oder eines anderen TemplateS)

{{(!}} class="wikitable"
{{!+}} Eine Tabellenüberschrift
{{!}} 
! Spaltenkopf A 
! Spaltenkopf B
{{!-}}
! Zeilenkopf 
{{!}} Zeile 1 / Spalte A 
{{!}} Zeile 1 / Spalte B
{{!-}}
{{!}}  
{{!}} Zeile 2 / Spalte A 
{{!}} Zeile 2 / Spalte B
{{!-}}
{{!}}
{{!}} colspan=2 {{!}} Zeile 3 / Spalte A und B
{{!)}}

Die Namen der Klassen und das Aussehen aller Varianten, sowie die alternative Nutzungsmöglichkeit, findet man auf der Seite → Vorlage mit verschiedenen Kästen

Wenn die Auswahl nicht ausreicht gibt es mit der Vorlage:Box-spezial die Möglichkeit viele Parameter der Vorlage beim Einbinden selbst anzupassen.

Hilfen im ZUM-Unterrichten: Vorlagen, allgemeine Hilfeseiten

Einstieg

1. Inhalte erstellen
   • neue Seiten anlegen
   • Texte einfügen
   • Überschriften
2. Medien einbinden
   • Youtube, Geogebra, etc.
   • Learning Apps
   • R-Quiz
   • ZUM-Apps einbinden
3. Lernpfad erstellen
   • Unterseiten
   • Fortsetzung

Vorlagen

• Boxen
• Mehrspaltenlayout
• Tabellen
• Icons
• Links als Buttons anzeigen
• Fachbezogene Vorlagen (Sicherheitsinfos, etc.)
• Hilfe zum Zitieren
• Farben

Wartung und Pflege

• Wiki-Hilfe - eure Vorschläge und Anregungen
• Seiten umbenennen und verschieben

neuen Platz finden

• 1. Inhaltliche Richtlinien

allgemeine Wiki-Hilfe

• in der Wikipedia

Alternativ: Boxen mittels div-Containern und CSS-Klassen erstellen

Nicht alle Inhalte können als Parameter an Vorlagen (Templates) übergeben werden, z.B. HTML Tags im Wikitext, Tabellen und anderes. Um trotzdem Boxen im gleichen Layout wie mittels obigen Vorlagen zu erstellen, gibt es auch korrespondierende CSS-Klassen. Dazu muss der Text, der in einer Box stehen soll in einen div-Container eingefasst werden:

Das schreibt man:

<div class="box ueben">
== Üben ==
...
</div>

Das sieht man:

Üben

mit Text für Übungen und Aufgaben

Folgende Boxen stehen zur Verfügung (analog oben)

<div class="box hervorhebung1">
== Hervorhebung 1 ==
...
</div>

<div class="box hervorhebung2">
== Hervorhebung 2 ==
...
</div>

<div class="box zitat">
== Zitat ==
...
</div>

<div class="box arbeitsmethode">
== Arbeitsmethode ==
...
</div>

<div class="box unterrichtsidee">
== Unterrichtsidee ==
...
</div>

<div class="box meinung">
== Meinung ==
...
</div>

<div class="box lernpfad">
== Lenrpfad ==
...
</div>

<div class="box experimentieren">
== Experimentieren ==
...
</div>

<div class="box loesung">
== Lösung ==
...
</div>

<div class="box ueben">
== Üben ==
...
</div>

<div class="box kurzinfo">
== Kurzinfo ==
...
</div>

<div class="box experimentieren">
== Experimentieren ==
...
</div>

<div class="box download">
== Download ==
...
</div>

Es müssen immmer die CSS-Klassen 'box' und ggf. die Art der Box im Beispiel oben also 'ueben' angegeben werden.

WICHTIG: Die CSS-Klassennamen müssen klein geschrieben sein, Umlaute müssen ersetzt werden (ü zu ue, ß zu sz usw.)

HINWEIS: Im Unterschied zur Verwendung des Templates werden die Überschriften im div-Container im Inhaltsverzeichnis aufgeführt. Insofern kann darüber auch gesteuert werden, welche Boxen im Inhaltsverzeichnis erscheinen sollen.

Icon ändern

Das Icon lässt sich auch überschreiben mit dem Parameter Icon.

Das schreibt man

{{Box|Titel|Inhalt|Lösung|Icon=brainy hdg-school}}

Das sieht man

Titel

Inhalt

Farbe ändern

Die Farbe lässt sich auch überschreiben mit dem Parameter Farbe.

Das schreibt man

{{Box|Titel|Inhalt|Lösung|Farbe={{Farbe|orange|dunkel}} }}

Das sieht man

Titel

Inhalt

Diese Vorlage wird benötigt

Ein Admin hat diese Vorlage überprüft und entschieden, dass diese Vorlage benötigt wird.

Keine Beschreibung.

Vorlagenparameter

Diese Vorlage hat eine benutzerdefinierte Formatierung.

Parameter		Beschreibung	Typ	Status
Klasse	Klasse3	keine Beschreibung Standard leer Beispiel Hervorhebung1, Frage, Lernpfad, Hervorhebung2, Merksatz, Üben, Ueben, Arbeitsmethode, Unterrichtsidee, Experimentieren, Arbeitsmethode, Unterrichtsidee, Experimentieren, Meinung, Lösung, Loesung, Download, Kurzinfo, Zitat, Autowert leer	Zeichenfolge	optional
Überschrift	Titel1	keine Beschreibung Standard leer Beispiel leer Autowert leer	Inhalt	optional
Inhalt	Inhalt2	keine Beschreibung Standard leer Beispiel leer Autowert leer	Inhalt	erforderlich
Farbe	Farbe	keine Beschreibung Standard leer Beispiel leer Autowert leer	Zeichenfolge	optional
Icon	Icon	keine Beschreibung Standard leer Beispiel leer Autowert leer	Zeichenfolge	optional