Hilfe:Vorlagen Design: Unterschied zwischen den Versionen

Aus HochN-Wiki
Wechseln zu:Navigation, Suche
(29 dazwischenliegende Versionen von 3 Benutzern werden nicht angezeigt)
Zeile 1: Zeile 1:
−
Diese Seite dient als Übersicht und Veranschaulichung der wichtigsten Designvorlagen, die in eine Seite eingebaut werden können. Die Seite muss dazu im Quelltext (oben rechts über die drei Punkte und "Quelltext bearbeiten") bearbeitet werden.
+
Diese Seite dient als Übersicht und Veranschaulichung der wichtigsten Designvorlagen, die in eine Seite eingebaut werden können. Die jeweilige Seite muss dazu im Quelltext (oben rechts über die drei Punkte und "Quelltext bearbeiten") bearbeitet werden.
  
 
Es gibt Designmöglichkeiten, die über "Wikitext", die Programmiersprache von Mediawiki, eingefügt werden können. Und es gibt Vorlagen, die wir individuell erstellt haben. Diese sind an den Klammern "{{ }}" zu erkennen.
 
Es gibt Designmöglichkeiten, die über "Wikitext", die Programmiersprache von Mediawiki, eingefügt werden können. Und es gibt Vorlagen, die wir individuell erstellt haben. Diese sind an den Klammern "{{ }}" zu erkennen.
Zeile 5: Zeile 5:
  
  
 +
<div class="toclimit-2">__TOC__</div>
  
−
{{TOC limit|2}}
 
 
==Literatur und Zitate==
 
==Literatur und Zitate==
 
<big>'''Vorlage: Literaturhinweis'''</big>
 
<big>'''Vorlage: Literaturhinweis'''</big>
Zeile 40: Zeile 40:
  
 
<br clear=all>
 
<br clear=all>
 +
 +
<big>'''Responsive Design'''</big>
 +
 +
Um Bilder/Grafiken responsive darzustellen für alle möglichen Screen-Sizes, ist dies in der CSS des Wikis definiert.<br>
 +
Beispiel:
 +
<div class="res-img">
 +
[[Datei:Titelbild schwarzes brett.png|alt=Grafik Schwarzes Brett|link=]]
 +
</div>
 +
 +
Dazu eingeben:
 +
<nowiki> <div class="res-img">[[Datei:Beispielgrafik.png|alt=Alternativer Text|link=]]</div> </nowiki>
  
 
<big>'''Weitere Formatierungsmöglichkeiten:'''</big>
 
<big>'''Weitere Formatierungsmöglichkeiten:'''</big>
 
Es gibt viele weitere Varianten für die Formatierung von Bildern. Sie sind [https://www.mediawiki.org/wiki/Help:Images/de hier] bei Mediawiki beschrieben.
 
Es gibt viele weitere Varianten für die Formatierung von Bildern. Sie sind [https://www.mediawiki.org/wiki/Help:Images/de hier] bei Mediawiki beschrieben.
 +
 +
 +
<big>'''Absatz einfügen'''</big>
 +
 +
In manchen Fällen ist es gewünscht, dass hinter oder vor einem Bild ein Absatz eingefügt wird, damit der Text erst nach dem Bild wieder beginnt. Dann muss im Quelltext folgendes hinter oder vor das Bild eingegeben werden:
 +
<nowiki><br clear=all></nowiki>
  
  
Zeile 74: Zeile 91:
 
</gallery></nowiki>
 
</gallery></nowiki>
  
−
Der Zusatz <nowiki>"alt="</nowiki> hinter dem Dateinamen dient zur Bildbeschreibung für Personen, die das Bild nicht sehen können bzw. für Screenreader. Es ist keine Pflichtangabe.
+
Der Zusatz <nowiki>"alt="</nowiki> hinter dem Dateinamen dient zur Bildbeschreibung für Personen, die das Bild nicht sehen können bzw. für Screenreader. Es ist keine Pflichtangabe, ist aber dringend empfohlen.
  
  
Zeile 123: Zeile 140:
 
<big>'''Weitere Formatierungsmöglichkeiten:'''</big>
 
<big>'''Weitere Formatierungsmöglichkeiten:'''</big>
  
−
Weitere Optionen für die Formatierung von Bildergalerien sind bei Wikipedia [https://de.wikipedia.org/wiki/Hilfe:Galerie hier] beschrieben.  
+
Weitere Optionen für die Formatierung von Bildergalerien sind bei Wikipedia [https://de.wikipedia.org/wiki/Hilfe:Galerie hier] beschrieben.
 +
 
 +
==Banner==
 +
<big>'''Vorlage: Achtung'''</big>
 +
{{Achtung|Text hier eingeben!}}
  
 +
Kopiervorlage: <nowiki>{{Achtung|Text hier eingeben!}}</nowiki>
  
  
 +
<big>'''Vorlage: ActionCall'''</big>
 +
{{ActionCall}}
  
 +
Kopiervorlage: <nowiki>{{ActionCall}}</nowiki>
  
−
==Banner==
+
<big>'''Vorlage: BoxBlau (im DG HochN Graublau; Logo)'''</big>
−
<big>'''Vorlage: Achtung'''</big>
+
{{BoxBlau|text=Deinen Text hier eingeben}}
−
{{Achtung|Text hier eingeben!}}
+
 
 +
Kopiervorlage: <nowiki>{{BoxBlau|text=Deinen Text hier eingeben}}</nowiki>
 +
 
 +
<big>'''Vorlage:BoxINNO'''</big>
 +
{{BoxINNO|Box zum Hervorheben von Text in den Projektfarben von INNO4BNE}}
 +
 
 +
Kopiervorlage: <nowiki>{{BoxINNO|Text hier eingeben}}</nowiki>
 +
 
 +
<big>'''Vorlage:BoxIMPACT'''</big>
 +
{{BoxIMPACT|Box zum Hervorheben von Text in den Projektfarben von IMPACT}}
 +
 
 +
Kopiervorlage: <nowiki>{{BoxIMPACT|Text hier eingeben}}</nowiki>
 +
 
 +
 
 +
<big>'''Vorlage:BoxIMPACTgrau'''</big>
 +
{{BoxIMPACTgrau|Box zum Hervorheben von Text in den Projektfarben von IMPACT}}
 +
 
 +
Kopiervorlage: <nowiki>{{BoxIMPACTgrau|Text hier eingeben}}</nowiki>
 +
 
 +
 
 +
<big>'''Vorlage:Boxtranhsform'''</big>
 +
{{Boxtranhsform|Box zum Hervorheben von Text in den Projektfarben von traNHSform}}
  
−
Kopiervorlage: <nowiki>{{Achtung|Text hier eingeben!}}</nowiki>
+
Kopiervorlage: <nowiki>{{Boxtranhsform|Text hier eingeben}}</nowiki>
  
  
Zeile 140: Zeile 186:
  
 
Kopiervorlage: <nowiki>{{Hinweis|Text hier eingeben!}}</nowiki>
 
Kopiervorlage: <nowiki>{{Hinweis|Text hier eingeben!}}</nowiki>
 +
 +
 +
<big>'''Vorlage: NichtAktuell'''</big>
 +
{{Nichtaktuell}}
 +
 +
Kopiervorlage: <nowiki>{{Nichtaktuell}}</nowiki>
  
  
Zeile 163: Zeile 215:
  
 
Kopiervorlage: <nowiki>{{Tipp|text=Text hier eingeben}}</nowiki>
 
Kopiervorlage: <nowiki>{{Tipp|text=Text hier eingeben}}</nowiki>
 +
 +
==Ausklappmenüs für Text==
 +
 +
<big>'''Vorlage: Expander'''</big>
 +
{{Expander|Titel|Dieser Text soll expandiert werden}}
 +
 +
Kopiervorlage: <nowiki>{{Expander|Titel|Dieser Text soll expandiert werden}}</nowiki>
 +
 +
 +
<big>'''Vorlage: ExpanderOffen'''</big>
 +
{{ExpanderOffen|Titel|Dieser Text soll expandiert werden}}
 +
 +
Kopiervorlage: <nowiki>{{ExpanderOffen|Titel|Dieser Text soll expandiert werden}}</nowiki>
 +
 +
 +
 +
==Tabellen==
 +
 +
Tabellen können am einfachsten über den VisualEditor eingefügt werden.
 +
Über den Quelltext können sie ebenfalls über die den Editor eingefügt werden. Sie sehen als Quelltext ausgeschrieben so aus:
 +
 +
<nowiki>{| class="wikitable"
 +
|+ Text der Überschrift
 +
|-
 +
! Überschrift !! Überschrift !! Überschrift
 +
|-
 +
| Beispiel || Beispiel || Beispiel
 +
|-
 +
| Beispiel || Beispiel || Beispiel
 +
|-
 +
| Beispiel || Beispiel || Beispiel
 +
|}</nowiki>
 +
 +
Weitere Formatierungsmöglichkeiten, z.B. bei der Farbwahl sind über Vorlagen möglich. Bspw. wie die beiden folgenden.
 +
 +
 +
<big>'''Vorlage: Themenspeicher'''</big>
 +
{{Themenspeicher
 +
|text1=Kurzbeschreibung
 +
|text2=Ziel
 +
|text3=Weiterführende Informationen
 +
|name=Name}}
 +
 +
Kopiervorlage:
 +
<nowiki>{{Themenspeicher
 +
|text1=Kurzbeschreibung
 +
|text2=Ziel
 +
|text3=Weiterführende Informationen
 +
|name=Name}}</nowiki>
 +
 +
<big>'''Vorlage: Ideensammlung'''</big>
 +
{{Ideensammlung
 +
|Idee=Kurzbeschreibung
 +
|Name=Name}}
 +
 +
Kopiervorlage:
 +
<nowiki>{{Ideensammlung
 +
|Idee=Kurzbeschreibung
 +
|Name=Name}}</nowiki>
  
  
Zeile 168: Zeile 279:
 
==Boxen und Kästen==
 
==Boxen und Kästen==
  
 +
<big>'''Vorlage: Kasten'''</big>
 +
{{Kasten
 +
|headline-bg-color = #FFFFFF
 +
|headline-color    = #000000
 +
|content-bg-color  = #FFFFFF
 +
|content-color    = #000000
 +
|id                = Ankermöglichkeit
 +
|headline          = Überschrift
 +
|content          = Inhalt der Box / Dein Text...
 +
}}
 +
 +
<nowiki>{{Kasten
 +
|headline-bg-color = #FFFFFF
 +
|headline-color    = #000000
 +
|content-bg-color  = #FFFFFF
 +
|content-color    = #000000
 +
|id                = Ankermöglichkeit
 +
|headline          = Überschrift
 +
|content          = Inhalt der Box / Dein Text...
 +
}}</nowiki>
 +
 +
<big>'''Vorlage: BoxListe'''</big>
 +
{{BoxListe
 +
  |bg-color=#dfcacf
 +
  |titel=Aktuelles
 +
  |Punkt1=Veranstaltung am 01.01.2024 <small>''- 23.10.23''</small>
 +
  |Punkt2=[[Hauptseite|Neues zum Projekt XYZ]] <small>''- 23.10.23''</small>
 +
  |Punkt3=[https://www.dg-hochn.de/ Dokumentation von...] <small>''- 23.10.23''</small>
 +
}}
 +
 +
Kopiervorlage:
 +
<pre>{{BoxListe
 +
  |bg-color=
 +
  |titel=
 +
  |Punkt1=
 +
  |Punkt2=
 +
  |Punkt3=
 +
}}</pre>
  
 
<big>'''Vorlage: CardSmall'''</big>
 
<big>'''Vorlage: CardSmall'''</big>
 
{{CardSmall
 
{{CardSmall
−
   |bg-color=#85B1D0
+
   |bg-color=##7b9cb1
−
   |titel=Beispiel
+
   |titel=Beispiel Titel
 
   |subtitel=Beispiel Unterüberschrift
 
   |subtitel=Beispiel Unterüberschrift
 
   |text=Hier steht ein Beispieltext. Die Farbwerte werden unter "bg-color" eingegeben.
 
   |text=Hier steht ein Beispieltext. Die Farbwerte werden unter "bg-color" eingegeben.
Zeile 184: Zeile 333:
 
   |text=
 
   |text=
 
}}</nowiki>
 
}}</nowiki>
 +
 +
<big>'''Vorlage: Cardsimple'''</big>
 +
{{Cardsimple
 +
  |bg-color=#7b9cb1
 +
  |text=Hier steht ein Beispieltext. Die Farbwerte werden unter "bg-color" eingegeben.
 +
}}
 +
 +
 +
<nowiki>{{Cardsimple
 +
  |bg-color=
 +
  |text=
 +
}}</nowiki>
 +
 +
<big>'''Vorlage: Cardheader'''</big>
 +
{{Cardheader
 +
  |header= Überschrift
 +
  |bg-color=#7b9cb1
 +
  |headalign=
 +
  |content=texttexttext
 +
}}
 +
 +
 +
<nowiki>{{Cardheader
 +
  |header=
 +
  |bg-color=
 +
  |headalign=
 +
  |content=
 +
}}</nowiki>
 +
 +
<big>'''Vorlage: CardZweifarbig'''</big>
 +
<br>Ähnlich wie Cardheader, aber auch Schriftfarbe ist anpassbar.
 +
{{CardZweifarbig
 +
  |color=#44546A
 +
  |bg-color=#7b9cb1
 +
  |position=left
 +
  |titel=Überschrift
 +
  |text=Text einfügen
 +
*1
 +
*2
 +
*3
 +
}}
 +
<pre>{{CardZweifarbig
 +
  |color=
 +
  |bg-color=
 +
  |position=
 +
  |titel=
 +
  |text=
 +
}}</pre>
  
 
<big>'''Vorlage: Card-Deck'''</big>
 
<big>'''Vorlage: Card-Deck'''</big>
Zeile 189: Zeile 386:
 
<div class="card-deck">
 
<div class="card-deck">
 
{{CardSmall
 
{{CardSmall
−
   |bg-color=#85B1D0
+
   |bg-color=#7b9cb1
−
   |titel=Beispiel
+
   |titel=Beispiel Titel
 
   |subtitel=Beispiel Unterüberschrift
 
   |subtitel=Beispiel Unterüberschrift
 
   |text=Hier steht ein Beispieltext. Die Farbwerte werden unter "bg-color" eingegeben.
 
   |text=Hier steht ein Beispieltext. Die Farbwerte werden unter "bg-color" eingegeben.
 
}}
 
}}
 
{{CardSmall
 
{{CardSmall
−
   |bg-color=#85B1D0
+
   |bg-color=#7b9cb1
−
   |titel=Beispiel
+
   |titel=Beispiel Titel
 
   |subtitel=Beispiel Unterüberschrift
 
   |subtitel=Beispiel Unterüberschrift
 
   |text=Hier steht ein Beispieltext. Die Farbwerte werden unter "bg-color" eingegeben.
 
   |text=Hier steht ein Beispieltext. Die Farbwerte werden unter "bg-color" eingegeben.
 
}}
 
}}
 
{{CardSmall
 
{{CardSmall
−
   |bg-color=#85B1D0
+
   |bg-color=#7b9cb1
−
   |titel=Beispiel
+
   |titel=Beispiel Titel
 
   |subtitel=Beispiel Unterüberschrift
 
   |subtitel=Beispiel Unterüberschrift
 
   |text=Hier steht ein Beispieltext. Die Farbwerte werden unter "bg-color" eingegeben.
 
   |text=Hier steht ein Beispieltext. Die Farbwerte werden unter "bg-color" eingegeben.
Zeile 217: Zeile 414:
 
  <nowiki><div class="card-deck">
 
  <nowiki><div class="card-deck">
 
{{CardSmall
 
{{CardSmall
−
   |bg-color=#85B1D0
+
   |bg-color=#7b9cb1
−
   |titel=Beispiel
+
   |titel=Beispiel Titel
 
   |subtitel=Beispiel Unterüberschrift
 
   |subtitel=Beispiel Unterüberschrift
 
   |text=Hier steht ein Beispieltext. Die Farbwerte werden unter "bg-color" eingegeben.
 
   |text=Hier steht ein Beispieltext. Die Farbwerte werden unter "bg-color" eingegeben.
 
}}
 
}}
 
{{CardSmall
 
{{CardSmall
−
   |bg-color=#85B1D0
+
   |bg-color=#7b9cb1
−
   |titel=Beispiel
+
   |titel=Beispiel Titel
 
   |subtitel=Beispiel Unterüberschrift
 
   |subtitel=Beispiel Unterüberschrift
 
   |text=Hier steht ein Beispieltext. Die Farbwerte werden unter "bg-color" eingegeben.
 
   |text=Hier steht ein Beispieltext. Die Farbwerte werden unter "bg-color" eingegeben.
 
}}
 
}}
 
{{CardSmall
 
{{CardSmall
−
   |bg-color=#85B1D0
+
   |bg-color=#7b9cb1
−
   |titel=Beispiel
+
   |titel=Beispiel Titel
 
   |subtitel=Beispiel Unterüberschrift
 
   |subtitel=Beispiel Unterüberschrift
 
   |text=Hier steht ein Beispieltext. Die Farbwerte werden unter "bg-color" eingegeben.
 
   |text=Hier steht ein Beispieltext. Die Farbwerte werden unter "bg-color" eingegeben.
 
}}
 
}}
 
</div></nowiki>
 
</div></nowiki>
−
 
−
 
−
<big>'''Vorlage: Kasten'''</big>
 
−
{{Kasten
 
−
|headline-bg-color = #FFFFFF
 
−
|headline-color    = #000000
 
−
|content-bg-color  = #FFFFFF
 
−
|content-color    = #000000
 
−
|id                = Ankermöglichkeit
 
−
|headline          = Überschrift
 
−
|content          = Inhalt der Box / Dein Text...
 
−
}}
 
−
 
−
<nowiki>{{Kasten
 
−
|headline-bg-color = #FFFFFF
 
−
|headline-color    = #000000
 
−
|content-bg-color  = #FFFFFF
 
−
|content-color    = #000000
 
−
|id                = Ankermöglichkeit
 
−
|headline          = Überschrift
 
−
|content          = Inhalt der Box / Dein Text...
 
−
}}</nowiki>
 
−
 
−
 
−
==Ausklappmenüs für Text==
 
−
 
−
<big>'''Vorlage: Expander'''</big>
 
−
{{Expander|Titel|Dieser Text soll expandiert werden}}
 
−
 
−
 
−
<nowiki>{{Expander|Titel|Dieser Text soll expandiert werden}}</nowiki>
 
−
 
−
<big>'''Vorlage: ExpanderOffen'''</big>
 
−
{{ExpanderOffen|Titel|Dieser Text soll expandiert werden}}
 
−
 
−
 
−
<nowiki>{{ExpanderOffen|Titel|Dieser Text soll expandiert werden}}</nowiki>
 
−
 
−
'''<big>Vorlage: ExpanderVar</big>'''
 
−
{{ExpanderVar
 
−
|titel=Titel
 
−
|inhalt=Dieser Text soll expandiert werden}}
 
−
 
−
 
−
<nowiki>{{ExpanderVar
 
−
|titel=Titel
 
−
|inhalt=Dieser Text soll expandiert werden}}</nowiki>
 
−
 
−
 
−
 
−
 
−
==Header==
 
−
 
−
<big>'''Vorlage: CardImage'''</big>
 
−
{{CardImage
 
−
  |image=Datei:DGHochN Icon Emergenz.png
 
−
  |width=250
 
−
  |link=
 
−
  |titel=Beispiel
 
−
  |text=Hier steht ein Beispieltext unterhalb des eingefügten Bildes.}}
 
−
 
−
 
−
<nowiki>{{CardImage
 
−
  |image=
 
−
  |width=250
 
−
  |link=
 
−
  |titel=
 
−
  |text=}}</nowiki>
 
−
 
−
<big>'''Vorlage: CardImageOT'''</big>
 
−
{{CardImageOT
 
−
  |image=Datei:DGHochN Icon Emergenz.png
 
−
  |width=250
 
−
  |link=
 
−
  |text= Hier steht eine Bildunterschrift. Diese Box hat keinen Titel eingebunden, der daher auch nicht automatisch in ein Inhaltsverzeichnis einer Seite eingebunden wird (im Vergleich zur Vorlage "CardImage").}}
 
−
 
−
 
−
<nowiki>{{CardImageOT
 
−
  |image=
 
−
  |width=250
 
−
  |link=
 
−
  |text=}}</nowiki>
 
−
 
−
<big>'''Vorlage: Jumbotron'''</big>
 
−
{{Jumbotron
 
−
  |bg-color=
 
−
  |color=
 
−
  |lead=
 
−
  |message=}}
 
−
 
−
<nowiki>{{Jumbotron
 
−
  |bg-color=
 
−
  |color=
 
−
  |lead=
 
−
  |message=}}</nowiki>
 
−
 
−
<big>'''Vorlage: Jumbotron Bilder'''</big>
 
−
{{Jumbotron_Bilder
 
−
  |bg-color=
 
−
  |color=
 
−
  |lead=
 
−
  |message=}}
 
−
 
−
<nowiki>{{Jumbotron_Bilder
 
−
  |bg-color=
 
−
  |color=
 
−
  |lead=
 
−
  |message=}}</nowiki>
 
−
 
−
==Tabellen==
 
−
 
−
<big>'''Vorlage: Themenspeicher'''</big>
 
−
{{Themenspeicher
 
−
|text1=Kurzbeschreibung
 
−
|text2=Ziel
 
−
|text3=Weiterführende Informationen
 
−
|name=Name}}
 
−
 
−
<nowiki>{{Themenspeicher
 
−
|text1=Kurzbeschreibung
 
−
|text2=Ziel
 
−
|text3=Weiterführende Informationen
 
−
|name=Name}}</nowiki>
 
−
 
−
<big>'''Vorlage: Ideensammlung'''</big>
 
−
{{Ideensammlung
 
−
|Idee=Kurzbeschreibung
 
−
|Name=Name}}
 
−
 
−
<nowiki>{{Ideensammlung
 
−
|Idee=Kurzbeschreibung
 
−
|Name=Name}}</nowiki>
 

Version vom 9. April 2024, 11:52 Uhr

Diese Seite dient als Übersicht und Veranschaulichung der wichtigsten Designvorlagen, die in eine Seite eingebaut werden können. Die jeweilige Seite muss dazu im Quelltext (oben rechts über die drei Punkte und "Quelltext bearbeiten") bearbeitet werden.

Es gibt Designmöglichkeiten, die über "Wikitext", die Programmiersprache von Mediawiki, eingefügt werden können. Und es gibt Vorlagen, die wir individuell erstellt haben. Diese sind an den Klammern "{{ }}" zu erkennen. Unter dem jeweiligen Beispiel ist auf dieser Seite die Kopiervorlage eingefügt. Entweder der Code für Wikitext oder die Vorlage mit den Klammern "{{ }}". Mit den Klammern startet und endet eine Vorlage. Dazwischen kann in einigen Fällen individueller Text oder Bilder eingefügt werden.


Literatur und Zitate

Vorlage: Literaturhinweis

Bücherstapel.png Autor etc.

Kopiervorlage: {{Literaturhinweis|Autor etc.}}


Vorlage: Zitat

Nachts sind alle Katzen grau.

- Hund


Kopiervorlage: {{Zitat|Text=Nachts sind alle Katzen grau.|Autor=Hund}}

Bilder

Bilder können auch über den VisualEditor hochgeladen und eingebunden werden. Weitere Formatierungen können im Quelltext bearbeitet werden.

In Originalgröße ohne Formatierung:

DG-Hub Nachhaltigkeitsstrategien 230306 3.jpeg 

[[Datei:Dateiname]]

Bild gerahmt und rechts eingebunden:

Bildunterschrift
[[Datei:Dateiname|thumb|Bildunterschrift]]


Bild ohne Rahmen und rechts eingebunden:

DG-Hub Nachhaltigkeitsstrategien 230306 3.jpeg
[[Datei:Dateiname|frameless|right]]


Responsive Design

Um Bilder/Grafiken responsive darzustellen für alle möglichen Screen-Sizes, ist dies in der CSS des Wikis definiert.
Beispiel:

Grafik Schwarzes Brett

Dazu eingeben: 

 <div class="res-img">[[Datei:Beispielgrafik.png|alt=Alternativer Text|link=]]</div>

Weitere Formatierungsmöglichkeiten: Es gibt viele weitere Varianten für die Formatierung von Bildern. Sie sind hier bei Mediawiki beschrieben.


Absatz einfügen

In manchen Fällen ist es gewünscht, dass hinter oder vor einem Bild ein Absatz eingefügt wird, damit der Text erst nach dem Bild wieder beginnt. Dann muss im Quelltext folgendes hinter oder vor das Bild eingegeben werden: 

<br clear=all>


Vorlage: Clear 

{{Clear}}

Es wird aus der Vorlage heraus nichts angezeigt. Die Vorlage verhindert den Textumfluss, ein seitliches umfließen des Textes um ein Bild oder einen Seitenbaustein. Der Effekt der Vorlage: Es geht mit dem Text einfach unterhalb eines Seitenelements weiter. Um diese Vorlage in einen Artikel zu integrieren, muss nur {{Clear}} in die entsprechende Seite eingetragen werden.


Bildergalerie mit Rahmen

  • eine Gruppe arbeitet in Diskussionsrunde
  • Nahaufnahme zweier Teilnehmender in Diskussionsrunde
  • Nahaufnahme zweier Teilnehmender vor Tafel
  • Drei Teilnehmende sitzend im Gespräch
  • Nahaufnahme über die Schulter auf einen Laptop

Kopiervorlage: 

<gallery>
Datei:Name der Datei |alt=eine Gruppe arbeitet in Diskussionsrunde
Datei:Name der Datei |alt=
Datei:Name der Datei |alt=
Datei:Name der Datei |alt=
Datei:Name der Datei |alt=
</gallery>

Der Zusatz "alt=" hinter dem Dateinamen dient zur Bildbeschreibung für Personen, die das Bild nicht sehen können bzw. für Screenreader. Es ist keine Pflichtangabe, ist aber dringend empfohlen.


Bildergalerie ohne Rahmen

  • eine Gruppe arbeitet in Diskussionsrunde
  • Nahaufnahme zweier Teilnehmender in Diskussionsrunde
  • Nahaufnahme zweier Teilnehmender vor Tafel
  • Drei Teilnehmende sitzend im Gespräch
  • Nahaufnahme über die Schulter auf einen Laptop

Kopiervorlage: 

<gallery mode=packed>
Datei:Name der Datei |alt=eine Gruppe arbeitet in Diskussionsrunde
Datei:Name der Datei |alt=
Datei:Name der Datei |alt=
Datei:Name der Datei |alt=
Datei:Name der Datei |alt=
</gallery>

Der Zusatz "alt=" hinter dem Dateinamen dient zur Bildbeschreibung für Personen, die das Bild nicht sehen können bzw. für Screenreader. Es ist keine Pflichtangabe.


Slideshow

  • eine Gruppe arbeitet in Diskussionsrunde
  • Nahaufnahme zweier Teilnehmender in Diskussionsrunde
  • Nahaufnahme zweier Teilnehmender vor Tafel
  • Drei Teilnehmende sitzend im Gespräch
  • Nahaufnahme über die Schulter auf einen Laptop

Kopiervorlage: 

<gallery mode=slideshow>
Datei:Name der Datei |alt=eine Gruppe arbeitet in Diskussionsrunde
Datei:Name der Datei |alt=
Datei:Name der Datei |alt=
Datei:Name der Datei |alt=
Datei:Name der Datei |alt=
</gallery>

Der Zusatz "alt=" hinter dem Dateinamen dient zur Bildbeschreibung für Personen, die das Bild nicht sehen können bzw. für Screenreader. Es ist keine Pflichtangabe.


Weitere Formatierungsmöglichkeiten:

Weitere Optionen für die Formatierung von Bildergalerien sind bei Wikipedia hier beschrieben.

Vorlage: Achtung

ACHTUNG: Text hier eingeben!

Kopiervorlage: {{Achtung|Text hier eingeben!}}


Vorlage: ActionCall

Fehler entdeckt? Sie haben Ergänzungen? Das Wiki lebt durch Ihre Mitarbeit. Passen Sie diese Seite an oder ergänzen Sie sie mit Ihren Informationen. Einen Account können Sie hier beantragen.

Kopiervorlage: {{ActionCall}}

Vorlage: BoxBlau (im DG HochN Graublau; Logo)

Deinen Text hier eingeben

Kopiervorlage: {{BoxBlau|text=Deinen Text hier eingeben}}

Vorlage:BoxINNO

Box zum Hervorheben von Text in den Projektfarben von INNO4BNE

Kopiervorlage: {{BoxINNO|Text hier eingeben}}

Vorlage:BoxIMPACT

Box zum Hervorheben von Text in den Projektfarben von IMPACT

Kopiervorlage: {{BoxIMPACT|Text hier eingeben}}


Vorlage:BoxIMPACTgrau

Box zum Hervorheben von Text in den Projektfarben von IMPACT

Kopiervorlage: {{BoxIMPACTgrau|Text hier eingeben}}


Vorlage:Boxtranhsform

Box zum Hervorheben von Text in den Projektfarben von traNHSform

Kopiervorlage: {{Boxtranhsform|Text hier eingeben}}


Vorlage: Hinweis

HINWEIS: Text hier eingeben!

Kopiervorlage: {{Hinweis|Text hier eingeben!}}


Vorlage: NichtAktuell

Sanduhr.png
 Diese Seite wird derzeit nicht mehr aktualisiert. Bringen Sie aktuelle Inhalte gerne ein.Pflanze.png

Kopiervorlage: {{Nichtaktuell}}


Vorlage: InArbeit

Work.png
 Diese Seite wird derzeit von Nutzerkennung, voraussichtlich bis Voraussichtliches Ende der Bearbeitung, bearbeitet.

Kopiervorlage: {{InArbeit | username=Nutzerkennung | ende=Voraussichtliches Ende der Bearbeitung}}


Vorlage: These

Text hier eingeben!

Kopiervorlage: {{These|detail=Text hier eingeben!}}


Vorlage: Tipp

Iconbulp.png Text hier eingeben

Kopiervorlage: {{Tipp|text=Text hier eingeben}}

Ausklappmenüs für Text

Vorlage: Expander

Titel

Dieser Text soll expandiert werden

Kopiervorlage: {{Expander|Titel|Dieser Text soll expandiert werden}}


Vorlage: ExpanderOffen

Titel

Dieser Text soll expandiert werden

Kopiervorlage: {{ExpanderOffen|Titel|Dieser Text soll expandiert werden}}


Tabellen

Tabellen können am einfachsten über den VisualEditor eingefügt werden. Über den Quelltext können sie ebenfalls über die den Editor eingefügt werden. Sie sehen als Quelltext ausgeschrieben so aus: 

{| class="wikitable"
|+ Text der Überschrift
|-
! Überschrift !! Überschrift !! Überschrift
|-
| Beispiel || Beispiel || Beispiel
|-
| Beispiel || Beispiel || Beispiel
|-
| Beispiel || Beispiel || Beispiel
|}

Weitere Formatierungsmöglichkeiten, z.B. bei der Farbwahl sind über Vorlagen möglich. Bspw. wie die beiden folgenden.


Vorlage: Themenspeicher

Idee

Kurzbeschreibung

Ziel

Ziel

WFI

Weiterführende Informationen

Impulsgeber:in / Ansprechpartner:in Name

Kopiervorlage: {{Themenspeicher |text1=Kurzbeschreibung |text2=Ziel |text3=Weiterführende Informationen |name=Name}}

Vorlage: Ideensammlung

Idee

Kurzbeschreibung

Impulsgeber:in / Ansprechpartner:in Name

Kopiervorlage: {{Ideensammlung |Idee=Kurzbeschreibung |Name=Name}}


Boxen und Kästen

Vorlage: Kasten

Überschrift

Inhalt der Box / Dein Text... 

{{Kasten
|headline-bg-color = #FFFFFF
|headline-color    = #000000
|content-bg-color  = #FFFFFF
|content-color     = #000000
|id                = Ankermöglichkeit
|headline          = Überschrift
|content           = Inhalt der Box / Dein Text...
}}

Vorlage: BoxListe

Aktuelles



Kopiervorlage: 

{{BoxListe
  |bg-color=
  |titel=
  |Punkt1=
  |Punkt2=
  |Punkt3=
}}

Vorlage: CardSmall

Beispiel Titel
Beispiel Unterüberschrift

Hier steht ein Beispieltext. Die Farbwerte werden unter "bg-color" eingegeben.


{{CardSmall
  |bg-color=
  |titel=
  |subtitel=
  |text=
}}

Vorlage: Cardsimple

Hier steht ein Beispieltext. Die Farbwerte werden unter "bg-color" eingegeben.


{{Cardsimple
  |bg-color=
  |text=
}}

Vorlage: Cardheader

Überschrift

texttexttext 


{{Cardheader
  |header=
  |bg-color=
  |headalign=
  |content=
 }}

Vorlage: CardZweifarbig
Ähnlich wie Cardheader, aber auch Schriftfarbe ist anpassbar.

Überschrift
Text einfügen
  • 1
  • 2
  • 3


{{CardZweifarbig
  |color=
  |bg-color=
  |position=
  |titel=
  |text=
}}

Vorlage: Card-Deck

Beispiel Titel
Beispiel Unterüberschrift

Hier steht ein Beispieltext. Die Farbwerte werden unter "bg-color" eingegeben.


Beispiel Titel
Beispiel Unterüberschrift

Hier steht ein Beispieltext. Die Farbwerte werden unter "bg-color" eingegeben.


Beispiel Titel
Beispiel Unterüberschrift

Hier steht ein Beispieltext. Die Farbwerte werden unter "bg-color" eingegeben.

Um die Boxen nebeneinander zu setzen, muss vor die erste Box folgendes gesetzt werden: 

<div class="card-deck">

und um zu schließen, hinter die letzte Box 

</div>

Also insgesamt: 

<div class="card-deck">
{{CardSmall
  |bg-color=#7b9cb1
  |titel=Beispiel Titel
  |subtitel=Beispiel Unterüberschrift
  |text=Hier steht ein Beispieltext. Die Farbwerte werden unter "bg-color" eingegeben.
}}
{{CardSmall
  |bg-color=#7b9cb1
  |titel=Beispiel Titel
  |subtitel=Beispiel Unterüberschrift
  |text=Hier steht ein Beispieltext. Die Farbwerte werden unter "bg-color" eingegeben.
}}
{{CardSmall
  |bg-color=#7b9cb1
  |titel=Beispiel Titel
  |subtitel=Beispiel Unterüberschrift
  |text=Hier steht ein Beispieltext. Die Farbwerte werden unter "bg-color" eingegeben.
}}
</div>
Abgerufen von „https://wiki.dg-hochn.de/index.php?title=Hilfe:Vorlagen_Design&oldid=16972“
Cookies helfen uns bei der Bereitstellung von HochN-Wiki. Durch die Nutzung von HochN-Wiki erklärst du dich damit einverstanden, dass wir Cookies speichern.
Weitere Informationen
Creative Commons „Namensnennung – nicht kommerziell – Weitergabe unter gleichen Bedingungen“
Powered by MediaWiki
Powered by Semantic MediaWiki