(5 dazwischenliegende Versionen desselben Benutzers werden nicht angezeigt)
Zeile 3:
Zeile 3:
[[Datei:banner-beispiel.png|450x450px]]</div>
[[Datei:banner-beispiel.png|450x450px]]</div>
Diese Vorlage erstellt einen Seitenbanner, den Sie zum Beispiel auf Portalseiten einbinden können. Ein Beispiel sehen Sie hier im Helpdesk auf den Themenseiten: [[Qualität_sichern]].
Diese Vorlage erstellt einen Seitenbanner, den Sie zum Beispiel auf Portalseiten einbinden können. Ein Beispiel sehen Sie hier im Helpdesk auf der Seite [[Community]].
==Import der Vorlage==
==Import der Vorlage==
Die benötigte Import-Datei befindet sich im Archiv ''HW-banner.zip''. Sie enthält die Datei ''HW-banner.xml''. '''Entpacken''' Sie die zip-Datei.
Die benötigte Import-Datei befindet sich im Archiv ''HW-banner.zip''. Sie enthält die Datei ''HW-banner.xml''. '''Entpacken''' Sie die zip-Datei.
Zeile 35:
Zeile 35:
!
!
! style="width:200px;" |Element
! style="width:200px;" |Element
!Wert
! style="width:180px;" |Wert
!Beschreibung
!Beschreibung
|-
|-
| rowspan="3" |1
| rowspan="3" |1
| style="width:200px;" |Bannergrafik
| style="width:200px;" |Bannergrafik
|QM:Flower_white.jpg
| style="width:180px;" |QM:Flower_white.jpg
|Bildname (mit Namensraum-Präfix, falls vorhanden, aber ohne Datei: Präfix). Der Banner kann auch ohne ein Bild generiert werden.
|Bildname (mit Namensraum-Präfix, falls vorhanden, aber ohne Datei: Präfix). Der Banner kann auch ohne ein Bild generiert werden.
|-
|-
| style="width:200px;" |Bildbreite
| style="width:200px;" |Bildbreite
|200
| style="width:180px;" |200
|Zahl, die Breite wird automatisch in Pixeln dargestellt. Standardwert: ''200''
|Zahl, die Breite wird automatisch in Pixeln dargestellt. Standardwert: ''200''
|-
|-
| style="width:200px;" |Bildposition
| style="width:200px;" |Bildposition
|left, right
| style="width:180px;" |left, right
|Fügt das Bild links- oder rechtsbündig ein. Standardwert ist ''left''.
|Fügt das Bild links- oder rechtsbündig ein. Standardwert ist ''left''.
|-
|-
| rowspan="3" |2
| rowspan="3" |2
| style="width:200px;" |Überschrift
| style="width:200px;" |Überschrift
|Meine Überschrift
| style="width:180px;" |Meine Überschrift
|Text der Überschrift.
|Text der Überschrift.
|-
|-
| style="width:200px;" |Größe der Überschrift
| style="width:200px;" |Größe der Überschrift
|1.6em
| style="width:180px;" |1.6em
|Größe kann auch als 16px oder andere gültige css-Werte angegeben werden. Standardwert ist ''1.6em''.
|Größe kann auch als 16px oder andere gültige css-Werte angegeben werden. Standardwert ist ''1.6em''.
|-
|-
| style="width:200px;" |Farbe der Überschrift
| style="width:200px;" |Farbe der Überschrift
|#444444
| style="width:180px;" |#444444
|Angabe als [https://www.w3schools.com/colors/colors_picker.asp Hex-Wert].
|Angabe als [https://www.w3schools.com/colors/colors_picker.asp Hex-Wert].
|-
|-
| rowspan="3" |3
| rowspan="3" |3
| style="width:200px;" |Text
| style="width:200px;" |Text
|Das ist der Inhalt.
| style="width:180px;" |Das ist der Inhalt.
|Text der Box.
|Text der Box.
|-
|-
| style="width:200px;" |Textgröße
| style="width:200px;" |Textgröße
|1.2em
| style="width:180px;" |1.2em
|''siehe Größe der Überschrift''
|''siehe Größe der Überschrift''
|-
|-
| style="width:200px;" |Textfarbe
| style="width:200px;" |Textfarbe
|#444444
| style="width:180px;" |#444444
|''siehe Farbe der Überschrift''
|''siehe Farbe der Überschrift''
|-
|-
|4
|4
| style="width:200px;" |Textabstand
| style="width:200px;" |Textabstand
|10px
| style="width:180px;" |10px
|Innerer Abstand von Titel und Text zur Box und zum Bild. Standardwert ist ''10px.''
|Innerer Abstand von Titel und Text zur Box und zum Bild. Standardwert ist ''10px.''
|-
|-
|5
|5
| style="width:200px;" |Abstand des Inhalts zur Box
| style="width:200px;" |Abstand des Inhalts zur Box
|20px
| style="width:180px;" |20px
|Äußerer Abstand der Inhalte zur Box. Standardwert ist ''0.''
|Äußerer Abstand der Inhalte zur Box. Standardwert ist ''0.''
|-
|-
|6
|6
| style="width:200px;" |Hintergrundfarbe der Box
| style="width:200px;" |Hintergrundfarbe der Box
|#efefef
| style="width:180px;" |#efefef
|Angabe als [https://www.w3schools.com/colors/colors_picker.asp Hex-Wert.] Standardwert ist ''#efefef'' (=hellgrau)
|Angabe als [https://www.w3schools.com/colors/colors_picker.asp Hex-Wert.] Standardwert ist ''#efefef'' (=hellgrau)
|-
|7
|Hintergrundicon
|bgicon1, bgicon2, bgicon3, swoosh
|Fügt einen [[Vorlagen Download/Seitenbanner#Hintergrundeffekt|Hintergrundeffekt]] hinzu.
|}
===Hintergrundeffect===
Folgende Hintergrundeffekte sind standardmäßig verfügbar. Sie sind hier in verschiedenen Bannerfarbvarianten dargestellt:
| style="width:680px;" |[[File:banner-bgicon1-de.png|650x650px|alternativtext=Banner mit Hintergrundicon bgicon1]]
|Heading color: #2e6096
Textfarbe: #2e6096
Hintergrundfarbe:#e9e9ee
Hintergrundicon:: bgicon1
|-
| style="width:150px;" |bgicon2
| style="width:680px;" |[[File:banner-bgicon2-de.png|650x650pxalt=Banner mit Hintergrundicon bgicon1|alternativtext=Banner mit Hintergrundicon bgicon2|650x650px]]
| style="width:680px;" |[[File:banner-bgicon3-de.png|650x650pxalt=Banner mit Hintergrundicon bgicon2|alternativtext=Banner mit Hintergrundicon bgicon3|650x650px]]
|Heading color: #ffffff
Textfarbe: #ffffff
Hintergrundfarbe:#747474
Hintergrundicon:: bgicon3
|-
| style="width:150px;" |swoosh
| style="width:680px;" |[[File:banner-swoosh-de.png|650x650px|alt=Banner mit Hintergrundicon bgicon3]]
Diese Vorlage erstellt einen Seitenbanner, den Sie zum Beispiel auf Portalseiten einbinden können. Ein Beispiel sehen Sie hier im Helpdesk auf der Seite Community.
Import der Vorlage
Die benötigte Import-Datei befindet sich im Archiv HW-banner.zip. Sie enthält die Datei HW-banner.xml. Entpacken Sie die zip-Datei.
Führen Sie auf der Seite Spezial:Import in Ihrem Wiki folgende Schritte durch:
Klicken Sie Browse... und wählen Sie die Datei HW-banner.xml.
Geben Sie ein Interwiki-Präfix an. Da dieses Feld erforderlich ist, geben Sie hier einfach hw (für hallowelt) ein.
Belassen Sie die Vorauswahl Zu den Standard-Speicherorten importieren.
Klicken Sie Datei hochladen... .
Die Vorlage ist nun in Ihrem Wiki verfügbar.
Enthaltene Importdateien
Der xml-Import erstellt folgende Dateien in Ihrem Wiki:
Vorlage:Banner
Vorlage:Banner/styles.css
Verwendung
Fügen Sie die Vorlage "Banner" über den Einfügen-Dialog von VisualEditor auf einer Wiki-Seite ein.Datei:Step4.pngFüllen Sie das Eingabeformular aus.