Vorlage:Kasten/Doku
Verwendung
BearbeitenDiese Vorlage bindet einen Kasten mit vordefiniertem Design auf einer Seite ein. Diese Vorlage kann beispielsweise überall da benutzt werden, wo man mit Hilfe von speziellen <div>-Tags das Design einer Seite ändern möchte.
Beispiel:
{{Kasten
|style=Info
|inhalt={{Blindtext}}
}}
Ergebnis:
Lorem ipsum dolor sit amet, consectetur adipisici elit, sed eiusmod tempor incidunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquid ex ea commodi consequat. Quis aute iure reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint obcaecat cupiditat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
Die Parameter
BearbeitenDer inhalt-Parameter
Bearbeiten
Der Inhalt eines Kastens wird über den Parameter inhalt oder 1 gesetzt. Die beiden Aufrufe
{{Kasten|inhalt=Text}}
und
{{Kasten|Text}}
sind also gleichbedeutend.
Der style-Parameter
Bearbeiten
Mit Hilfe des Parameters style kann das Design eines Kastens gesteuert werden. Folgende Designstile sind vordefiniert:
Wert für style |
Ergebnis |
|---|---|
| Info | Lorem ipsum dolor sit amet, consectetur adipisici elit, sed eiusmod tempor incidunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquid ex ea commodi consequat. Quis aute iure reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint obcaecat cupiditat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. |
| Hinweis | Lorem ipsum dolor sit amet, consectetur adipisici elit, sed eiusmod tempor incidunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquid ex ea commodi consequat. Quis aute iure reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint obcaecat cupiditat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. |
| Fehlermeldung | Lorem ipsum dolor sit amet, consectetur adipisici elit, sed eiusmod tempor incidunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquid ex ea commodi consequat. Quis aute iure reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint obcaecat cupiditat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. |
| Systemnachricht | Lorem ipsum dolor sit amet, consectetur adipisici elit, sed eiusmod tempor incidunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquid ex ea commodi consequat. Quis aute iure reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint obcaecat cupiditat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. |
| grauer Rahmen | Lorem ipsum dolor sit amet, consectetur adipisici elit, sed eiusmod tempor incidunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquid ex ea commodi consequat. Quis aute iure reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint obcaecat cupiditat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. |
| blauer Rahmen | Lorem ipsum dolor sit amet, consectetur adipisici elit, sed eiusmod tempor incidunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquid ex ea commodi consequat. Quis aute iure reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint obcaecat cupiditat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. |
| blauer Kasten | Lorem ipsum dolor sit amet, consectetur adipisici elit, sed eiusmod tempor incidunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquid ex ea commodi consequat. Quis aute iure reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint obcaecat cupiditat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. |
| grauer Kasten | Lorem ipsum dolor sit amet, consectetur adipisici elit, sed eiusmod tempor incidunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquid ex ea commodi consequat. Quis aute iure reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint obcaecat cupiditat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. |
| dezenter grauer Kasten | Lorem ipsum dolor sit amet, consectetur adipisici elit, sed eiusmod tempor incidunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquid ex ea commodi consequat. Quis aute iure reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint obcaecat cupiditat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. |
keine Wert für style |
Lorem ipsum dolor sit amet, consectetur adipisici elit, sed eiusmod tempor incidunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquid ex ea commodi consequat. Quis aute iure reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint obcaecat cupiditat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. |
Es können einfach auch weitere Styles definiert werden. Wenn du für deine Arbeit weitere Styles brauchst, dann melde dich bitte bei Benutzer:Stephan Kulla.
Der Parameter position
Bearbeiten
Durch den Parameter position wird die Ausrichtung, Positionierung und Breite der Box gesteuert. Folgende Werte sind möglich:
Wert für position |
Ergebnis |
|---|---|
| ganze Breite | Der Kasten |
| float rechts | Der Kasten |
| float links | Der Kasten |
| links | Der Kasten |
| rechts | Der Kasten |
| mittig | Der Kasten |
keine Angabe eines Wertes für position |
Der Kasten |
Die Breite des Kastens
BearbeitenDie Breite des Kasten wird über die 3 Parameter max-width, min-width und width gesteuert. Diese Parameter haben folgende Bedeutungen
| Parameter | Bedeutung | Link auf entsprechende CSS-Eigenschaft |
|---|---|---|
max-width |
Definiert die maximale Breite des Kastens. | max-width |
min-width |
Definiert die minimale Breite des Kastens. | min-width |
width |
Setzt die Breite des Kastens explizit. | width |
Für alle Parameter können Werte wie beispielsweise 50% oder 20em eingetragen werden, die auch für die entsprechenden CSS-Eigenschaften verwendet werden können. Je nachdem, was für position eingetragen ist, haben die Parameter eine unterschiedliche Bedeutung:
Wert für position |
Bedeutung der Parameter max-width, min-width und width
|
|---|---|
ganze Breite oder keine Angabe des Parameters position
|
Der Kasten nimmt stets 100% der verfügbaren Breite ein. max-width, min-width und width werden ignoriert.
|
float rechts oder float links
|
Ist width gesetzt, so hat der Kasten stets die von width definierte Breite. Ist width undefiniert, so definiert max-width die maximal mögliche und min-width die minimal mögliche Breite. Wenn width nicht definiert ist, ist der Kasten auch nie Breiter als es notwendig ist.
|
links oder rechts
|
Der Kasten hat stets die Breite von width. max-width und min-width werden ignoriert.
|
mittig
|
Der Kasten hat stets die Breite von width. Ist außenabstand gesetzt, so definiert dieser Parameter die Kastenbreite (siehe nächsten Abschnitt) und width wird ignoriert. max-width und min-width werden stets ignoriert.
|
Es gelten folgende Standardwerte:
Wert für position |
Standardwerte für max-width |
Standardwert für min-width |
Standardwert für width
|
|---|---|---|---|
ganze Breite oder keine Angabe des Parameters position |
wird ignoriert | 15em | wird ignoriert |
float rechts oder float links |
25% | 15em | nicht gesetzt |
links oder rechts |
wird ignoriert | 15em | 33% |
mittig |
wird ignoriert | 15em | 50% |
Der Parameter außenabstand bei mittig positionierten Kästen
Bearbeiten
Eine Besonderheit gibt es, wenn position auf mittig gestellt ist. Hier gibt es nämlich zwei Möglichkeiten die Breite eines Kastens zu definieren. Einmal kann die Breite über die obig erklärten Parameter gesetzt werden, zum anderen kann die Breite des Kastens dadurch definiert werden, dass der Außenabstand vom Kasten zum linken Rand bzw. vom Kasten zum rechten Rand gesetzt wird. Dadurch ergibt sich bei einem mittig gesetzten Kasten automatisch seine Breite.
Hierzu dient der Parameter außenabstand. Dieser gibt bei einem mittig gesetzten Kasten den Abstand zu den Außenrändern an. Es können alle Werte gesetzt werden, die für die CSS-Eigenschaften margin-left bzw. margin-right erlaubt sind (Der Wert für außenabstand wird direkt für margin-left bzw. margin-right verwendet).
Beispiel:
{{Kasten
|style=blauer Rahmen
|außenabstand=50px
|position=mittig
|inhalt={{Blindtext}}
}}
Ergebnis:
Lorem ipsum dolor sit amet, consectetur adipisici elit, sed eiusmod tempor incidunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquid ex ea commodi consequat. Quis aute iure reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint obcaecat cupiditat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
Beachte, dass wenn außenabstand gesetzt ist, die Paramter width, max-width und min-width keine Anwendung finden, weil die Breite des Kastens bereits über den Außenabstand gesteuert wird.
Weitere Parameter
BearbeitenDiese Vorlage basiert auf Vorlage:HTMLTag. Folgende Parameter der Vorlage:HTMLTag können auch benutzt werden:
html-taginline(Der Standardwert für diese Vorlage istinline=nein)clearfloat-objekte-beachtencssclassnomobilenoprintidmf-id
Gründe für diese Vorlage
BearbeitenNach Möglichkeit sollte kein HTML auf Wikibooks-Seiten direkt enthalten sein, da dies zum einen den Quelltext kompliziert und schlechter lesbar macht und weil zum anderen das HTML mit dem dazugehörigen CSS nur von Experten bearbeitet werden kann. Der Quelltext für eine Vorlageneinbindung ist im Gegensatz dazu einfacher zu verstehen. Außerdem lässt sich so das Design von Wikibooks zentral über Vorlagen steuern.
Vorlagen-Spezifikation
Vorlage, um einen Kasten mit spezifischen Inhalt einzubinden.
| Parameter | Beschreibung | Typ | Status | |
|---|---|---|---|---|
| Inhalt | inhalt 1 | Der Inhalt des Kastens. | Wikitext | erforderlich |
| Style | style | Das Design des Kastens. | Einzeiliger Text | vorgeschlagen |
| Position | position | Die Positionierung und Ausrichtung des Kastens.
| Einzeiliger Text | optional |
| Breite | width | Die Breite des Kastens. | Einzeiliger Text | optional |
| Maximale Breite | max-width | Die maximale Breite des Kastens. | Einzeiliger Text | optional |
| Minimale Breite | min-width | Die minimale Breite des Kastens.
| Einzeiliger Text | optional |
| Außenabstand | außenabstand | Außenabstand bei mittig zentrierten Kästen. | Einzeiliger Text | optional |
| Clear | clear | Wert der CSS-Eigenschaft „clear“. | Einzeiliger Text | optional |
| Inline? | inline | Setze diesen Parameter auf „ja“, wenn der Inhalt nur Inline-Text ist.
| Einzeiliger Text | optional |
| No-Mobile? | nomobile | Setze diesen Parameter auf „ja“, wenn der Inhalt auf mobilen Seiten versteckt werden soll. | Einzeiliger Text | optional |
| No-Print? | noprint | Setze diesen Parameter auf „ja“, wenn der Inhalt in der Druckversion der Seite versteckt werden soll. | Einzeiliger Text | optional |
| Mf-ID | mf-id | MF-ID (siehe Vorlagendokumentation) | Einzeiliger Text | optional |
| Kasten-Tag-Name | html-tag | Name des HTML Tag Namens für den Kasten
| Einzeiliger Text | optional |
| ID | id | Setzt das HTML-Attribut id des Kastens. | Einzeiliger Text | optional |
| Float-Objekte beachten? | float-objekte-beachten | Sollen anderene gefloatete Objekte für die Breitenbestimmung berücksichtigt werden?
| Einzeiliger Text | optional |
| Weiteres CSS | css | Weiteres CSS für den Kasten | Einzeiliger Text | optional |
Hinweis: Diese Vorlagen-Spezifikation wurde mit Hilfe der Parsererweiterung <templatedata> erstellt. Siehe Vorlage:TemplateData für eine Erklärung, wie du <templatedata> auf Wikibooks verwenden kannst.
<templatedata> wird unter anderem vom VisualEditor verwendet. Eine ausführliche Hilfe zu dieser Parsererweiterung findest auf der Seite Help:TemplateData.