Hilfe:Textgestaltung

In diesem Artikel wird auf die in der mediaWiki Software möglichen Elemente der Textgestaltung bezug genommen. Zunächst werden die gängigsten Textgestaltungselemente vorgestellt und im weiteren Verlauf um spezifische Elemente ergänzt.

Die hier aufgeführten Befehle beziehen sich auf den Standardeditor und den WikiEditor, welche über keine oder nur eine rudimentäre WYSIWYG-Funktion verfügen. Bei WYSIWYG-Editoren (wie der VisualEditor) muss zunächst in die Quellcode- / Code-Ansicht gewechselt werden.

Textgestaltung

Formatierung

Zu Beginn werden hier die Elemente der Textformatierung vorgestellt.

Text fett hervorheben

Um eine Textpassage fett hervorzuheben muss diese von drei einfachen Anführungszeichen ''' umschlossen werden. Dabei leiten die ersten drei einfachen Anführungszeichen die Hervorhebung ein und die letzten drei beenden diese.

Beispiel: In dieser Textpassage soll etwas fett hervorgeheben werden.

Code: In dieser Textpassage soll '''etwas fett hervorgeheben''' werden.

Text kursiv schreiben

Damit eine Textpassage kursiv dargestellt wird, wird diese in zwei einfache Anführungszeichen '' umschlossen. Wie bereits beim Text fett hervorheben leiten die ersten zwei einfachen Anführungszeichen die Kursiv-schreiben-Modus ein und die abschließenden zwei einfachen Anführungszeichen beenden den Modus.

Beispiel: Eine Textpassage dieses Satzes wird nun kursiv geschrieben und zwar solange bis dieser Modus beendet wurde.

Code: Eine Textpassage dieses Satzes wird nun ''kursiv geschrieben und zwar solange bis dieser Modus beendet'' wurde.

Text fett und kursiv darstellen

Beide zuvor vorgestellten Gestaltungselemente können auch kombiniert werden. Dabei wird die Textpassage von fünf einfache Anführungszeichen ''''' umschlossen.

Beispiel: Es folgt eine Textpassage, in der nun Text fett und kursiv hervorgehoben wird um dies ein mal zu demonstrieren.

Code: Es folgt eine Textpassage, '''''in der nun Text fett und kursiv hervorgehoben wird''''' um dies ein mal zu demonstrieren.

Text unterstrichen darstellen

Um Textstellen zu unterstreichen muss dieser mit den Befehlen <u> </u> umschlossen werden.

Beispiel: Hier soll das unterstreichen von Textkomponenten demonstriert werden.

Code: Hier soll das <u>unterstreichen von Textkomponenten</u> demonstriert werden.

Text durchgestrichen abbilden

Ebenso kann Text auch als durchgestrichen dargestellt werden. Dies geschieht, in dem der betreffende Text zwischen <s> </s> oder Alternativ auch <strike> </strike> gestellt wird und ist nützlich um veraltete Informationen als nicht mehr gültig hervorzuheben.

Beispiel: Nerd sind ausschließlich männliche Personen. Weibliche Personen können keine Computer programmieren.

Code: Nerd sind <s>ausschließlich</s> männliche Personen. Weibliche Personen können <strike>keine</strike> Computer programmieren.

Text hochstellen

Gelegentlich ist es von nöten Text hochgestellt darzustellen, beispielsweise weil Anmerkungen in einem noch nicht veröffentlichten Artikel getätigt werden sollen. Dies wird mit dem Tag  erreicht.

Beispiel: Diese Aussage enthält keine Aussage.^{Ist dem tatsächlich so?}

Code: Diese Aussage enthält keine Aussage.^{Ist dem tatsächlich so?}

Text tiefstellen

Text lässt sich auch tief stellen und kann ebenso wie das hochstellen zum Hinzufügen von Anmerkungen genutzt werden. Genauso wie für das hochstellen ist auch für das tiefstellen von Texten der Befehl in der Tag Syntax und lautet .

Beispiel: Nachts sind alle _{Was ist mit schwarz?} Katzen grau.

Code: Nachts sind alle _{Was ist mit schwarz?} Katzen grau.

Text vergrößern

Gelegentlich ist es notwendig die Schrift in einer Textpassage vergrößert abzubilden und diesen somit vom restlichen Text abzuheben. Möglich ist dies über den Tag <big> </big>.

Beispiel: Wir schreiben heute das frei sein groß!

Code: Wir schreiben <big>heute das frei sein</big> groß!

Text verkleinern

Genauso wie manche Textpassagen vergrößert hervorgehoben werden soll können analog dazu Textpassagen auch kleiner als der Rest des Textes dargestellt werden. Der hierfür notwendige Tag lautet <small> </small> und muss ebenso die Textpassage umschließen.

Beispiel: Manchmal möchte man einfach nur klein sein um nicht gesehen zu werden.

Code: Manchmal möchte man <small>einfach nur klein sein um nicht</small> gesehen zu werden.

Farblicher Text

Um bestimmte Textabschnitte andersfarbig vom restlichen Text abzuheben muss auf den HTML-Tag <span style="color:<Name der Farbe in Englisch>;"> </span> zurückgegriffen werden. Der Tag <span> </span> an sich hat keinerlei Wirkung und dient eigentlich nur dazu vordefinierte Cascading Style Sheets (kurz CSS) auf den entsprechenden Text anzuwenden. Die Umfärbung des Textes wird durch die Definition des Aussehens (engl. style) im sogenannten Attribut style="" erzeugt. Die Angabe der zu verwendenden Farbe kann in Hexadezimal, RGB, RGBA, HSL, HSLA oder als Name stattfinden und ist durch das W3C festgelegt.

Hinweis: Das Umfärben von Textabschnitten mit Zeilenumbrüchen ist über den Tag <span style="color:(Farbwert);"></span> nicht möglich. Stattdessen muss dies mittels <div style="color:(Farbwert);"></div> erzeugt werden.

Beispiel mit <span></span>: Wir können unter anderem Text rot oder auch blue oder eben grün oder auch knallig orange einfärben.

Code: Wir können unter anderem Text <span style="color:red;">rot</span> oder auch <span style="color:blue;">blue</span> oder eben <span style="color:green;">grün</span> oder auch knallig <span style="color:orange;">orange</span> einfärben.

Beispiel mit mehrzeiliger Umfärbung (<div></div>):

R.

E.

D.

ist schon ein cooler Film!

Code:

1. <div style="color:red;">
2. R.
3.  
4. E.
5.  
6. D.
7.  
8. ist schon ein cooler Film!</div>

Text mit andere Schriftart anzeigen

Um Text in einer anderen Schriftart darzustellen wird ebenfalls der HTML-Tag <span> </span> zusammen mit dem Attribut style="" verwendet. Über den CSS Befehl font-family:<Schriftart> können andere Schriftarten eingebunden werden. Vollständig sieht der Befehl so aus: <span style="font-family:serif;"> </span>.

Hinweis: Es sollte nur in Ausnahmesituationen auf andere Schriftarten zurückgegriffen werden, da einerseits die Artikel möglichst einheitlich aussehen sollen und anderseits manche Schriftarten nicht auf jeden Betriebssystem verfügbar sind.

Beispiel:
Text in Times New Roman,
Arial,
Verdana,
Courier und
Serif

Code:

1. Text in <span style="font-family:Times New Roman;">Times New Roman</span>,<br />
2. <span style="font-family:Arial;">Arial</span>,<br />
3. <span style="font-family:Verdana;">Verdana</span>,<br />
4. <span style="font-family:Courier;">Courier</span> und<br />
5. <span style="font-family:serif;">Serif</span><br />

Text ausrichten

In manchen Situationen soll ein Textabschnitt anders als der Rest am Anzeigebereich auszurichten sein. Die Ausrichtung wird über den HTML-Tag <div> </div> erreicht. Die Steuerung der Ausrichtung erfolgt wieder als CSS Befehl im style="" Attribut und wird über text-align:<Ausrichtung>; definiert. Die Ausrichtung kann dabei links- oder rechtsbündig sowie zentriert sein oder als Blocksatz dargestellt werden. Komplett sieht der Befehl wie folgt aus: <div style="text-align:(Ausrichtung);"> </div>. Der <div> </div> Tag ist ein HTML-Blockelement, d.h. dessen Wirkung erstreckt sich über einen komletten Textblock und kann mehrzeilig sein.

Hinweis: Wird die Ausrichtung eine Passage mitten im Textfluss verändert wird auch automatisch ein Zeilenumbruch mit erzeugt.

Hinweis #2: Die Textausrichtung kann auch über <div align="(Ausrichtung)"> </div> und <center> </center> erzeugt werden. Letzter Befehl zentriert den umschlossenen Text. Von der Verwendung dieser wird jedoch abgeraten, da beide Befehle laut dem W3C nicht von HTML 5 unterstützt werden.

Text linksbündig ausrichten (ist voreingestellt)

Beispiel:

Dieser Textabschnitt wurde vorher zentriert, damit die Auswirkung der

linksbündigen Ausrichtung

auch erkennbar wird.

Code:

1. <div style="text-align:center;">
2. Dieser Textabschnitt wurde vorher zentriert, damit die Auswirkung der
3. <div style="text-align:left;">
4. linksbündigen Ausrichtung
5. </div>
6. auch erkennbar wird.
7. </div>

Text zentriert ausrichten

Beispiel:

Ein kompletter Textabschnitt wird

zentriert

dargestellt.

Code:

1. <div style="text-align:center;">
2. Ein kompletter Textabschnitt wird
3.  
4. zentriert
5.  
6. dargestellt.
7. </div>

Text rechtsbündig ausrichten

Beispiel:

Dieser Text soll

nun rechtsbündig ausgerichtet werden.

Code:

1. <div style="text-align:right;">Dieser Text soll
2.  
3. nun rechtsbündig ausgerichtet werden.
4. </div>

Text als Blocksatz ausrichten

Beispiel:

Eine ganze Menge Text kann auch als Blocksatz angezeigt werden.

Ob man diese Darstellung mag muss man selbst wissen. In manchen Situationen kann es aber sicherlich vorteilhaft sein die Textausrichtung im Blocksatzmodus zu betreiben. Allerdings sollte diese Ausrichtung nicht exzessiv über mehrere Absätze hinweg verwendet werden.

1. <div style="text-align:justify;">
2. Eine ganze Menge Text kann auch als Blocksatz angezeigt werden.
3.  
4. Ob man diese Darstellung mag muss man selbst wissen. In manchen Situationen kann es aber sicherlich vorteilhaft sein die Textausrichtung im Blocksatzmodus zu betreiben. Allerdings sollte diese Ausrichtung nicht exzessiv über mehrere Absätze hinweg verwendet werden.
5. </div>

Horizontallinie zur Abgrenzung nutzen

Um Inhalte optisch abzugrenzen bietet sowohl der mediaWiki- als auch HTML-Befehlssatz eine Möglichkeit horizontale Linien einzubinden. Der mediaWiki-Befehl lautet recht simpel ----, die HTML-Variante ist <hr />. Die HTML-Variante bietet sich an, wenn die Horizontallinie über das bereits bekannte HTML-Attribut style="" optisch angepasst werden soll.

Beispiele: Die Horizontallinie mittels dem mediaWiki Befehl:

---

und über den HTML-Befehl

---

abschließend eine eingefärbte Horizontallinie mittels HTML-Befehl (über den mediaWiki Befehl nicht möglich!)

---

---

---

Code:

1. Die Horizontallinie mittels dem mediaWiki Befehl:
2. ----
3. und über den HTML-Befehl <hr />
4. abschließend eine eingefärbte Horizontallinie mittels HTML-Befehl (über den mediaWiki Befehl nicht möglich!)
5. <hr style="border:solid red 1px;">
6. <hr style="border:solid green 1px;">
7. <hr style="border:solid blue 1px;">

Anmerkung: Um mit dem mediaWiki Befehl eine Horizontallinie zu erzeugen muss dieser zwingend alleine in einer Zeile stehen. Der HTML-Tag (bzw. der Webbrowser) hingegen erzeugt automatisch einen Zeilenumbruch.

Wiki-Syntax bei einer Textpassage deaktivieren

In manchen Situationen ist es gewünscht, dass der mediaWiki-Parser eine Zeichenfolge nicht als mediaWiki-Befehl auffasst. Dies trifft besonders dann zu, wenn die mediaWiki-Befehle als Textzeichen benutzt werden sollen. Ein vom mediaWiki-Parser ignorierter Textabschnitt wird über den mediaWiki-Befehl <nowiki> </nowiki> erzeugt. Alle Befehle innerhalb dieses Befehls werden als normale Textzeichen interpretiert und ausgegeben.

Beispiel: Damit die Hochkommata '' keinen kursiven Text einleiten wird dieser Befehl genutzt. Es handelt sich dann nicht um einen ''mediaWiki-Befehl''.

Code: Damit <nowiki>die Hochkommata '' keinen kursiven Text einleiten wird dieser Befehl genutzt. Es handelt sich dann nicht um einen ''mediaWiki-Befehl''</nowiki>.

Überschriften

Um längere Texte leichter in Sinnabschnitte unterteilen zu können bietet auch die mediaWiki Software die Möglichkeit an Überschriften zu benutzen. In der Standardeinstellung wird bei längeren Texten durch das mediaWiki anhand dieser Überschriften ein Inhaltsverzeichnis generiert, wodurch die entsprechenden Textabschnitte auch direkt angesprungen werden können. Die Überschriften können in sechs Ebenen tief gestaffelt werden.

Der Befehl zum Erzeugen einer Überschrift ist in der ersten Ebene ein einfaches =, welches den Überschritstext entsprechend umschließt. Tiefere Überschriftsebenen werden praktischerweise ebenfalls mit = eingeleitet, wobei die gewünschte Tiefe der Überschriftsebene der Anzahl der = entspricht.

Beispiele:

Überschrift 1. Ebene

Code: = Überschrift 1. Ebene =

Überschrift 2. Ebene

Code: == Überschrift 2. Ebene ==

Überschrift 3. Ebene

Code: === Überschrift 3. Ebene ===

Überschrift 4. Ebene

Code: ==== Überschrift 4. Ebene ====

Überschrift 5. Ebene

Code: ===== Überschrift 5. Ebene =====

Überschrift 6. Ebene

Code: ====== Überschrift 6. Ebene ======

Listen

Der mediaWiki Software kennt drei verschiedene Formen von Listen, Aufzählungen, nummerierte Listen und Definitionslisten. Die Verwendung von Listen bietet sich immer dann an, wenn kurzer Text geordnet und vom restlichen Text etwas abgehoben werden soll.

Aufzählungen / Aufzählende Liste

Aufzählungen bzw. Aufzählende Listen werden immer dann verwendet, wenn in irgendeiner Form eine einfache Auflistung stattfinden soll.

Anmerkung: Doppelpunkten : und Semikola ; haben in aufzählenden Listen eine Steuerfunktion und führen einen Zeilenumbruch (via Doppelpunkt) herbei bzw. heben im Falle des Semikolon den Folgetext fett hervorheben (siehe Beispiel).

Beispiel:

• Ananas

  Apfel

• Birne

  Erdbeere

  Lecker

• Kiwi
• Zitrone

Code:

1. * Ananas
2. *: Apfel
3. * Birne
4. *; Erdbeere: Lecker
5. * Kiwi
6. * Zitrone

Nummierte Liste

Um bei einer Auflistung eine strengere Hi­e­r­ar­chie hervorzuheben ist eine aufzählende Liste nicht ausreichend. Für diese Fälle bietet das mediaWiki die Möglichkeit nummerierte Listen zu benutzen. Diese können beispielsweise Helfen eine algorithmisches Vorgehen zu verdeutlichen.

Anmerkung: Doppelpunkten : und Semikola ; haben in nummerierten Listen eine Steuerfunktion und führen einen Zeilenumbruch (via Doppelpunkt) herbei bzw. heben im Falle des Semikolon den Folgetext fett hervorheben (siehe Beispiel).

Beispiel:

1. Telefonhörer abnehmen.

   Bei neueren Mobilfunktelefonen: Tastensperre aufheben.

2. Telefonnummer wählen.
3. Warten bis die Gegenstelle das Gespräch annimmt.
4. Gespräch führen.
5. Zum beenden des Gespräches den Telefonhörer auflegen.

   Bei neueren Mobilfunktelefonen

   Entsprechende Taste betätigen.

Code:

1. # Telefonhörer abnehmen.
2. #: Bei neueren Mobilfunktelefonen: Tastensperre aufheben.
3. # Telefonnummer wählen.
4. # Warten bis die Gegenstelle das Gespräch annimmt.
5. # Gespräch führen.
6. # Zum beenden des Gespräches den Telefonhörer auflegen.
7. #; Bei neueren Mobilfunktelefonen: Entsprechende Taste betätigen.

Definitionsliste

Definitionslisten werden vor allem in wissenschaftlichen Texten benötigt. Mit deren Hilfe können Definitionen strukturiert dargestellt werden. Anders als bei wikipedia werden Definitionslistenelemente die auf einem Doppelpunkt : folgen nicht automatisch eingerückt.

Beispiel #1:

Definitionsliste

Lebewesen: Organisierte Einheiten, die unter anderem zu Stoffwechsel, Fortpflanzung, Reizbarkeit, Wachstum und Evolution fähig sind.

Biomasse: Stoffgemische, die in Lebewesen gebunden und/oder von ihnen erzeugt werden

Code:

1. ; Definitionsliste
2. : Lebewesen: Organisierte Einheiten, die unter anderem zu Stoffwechsel, Fortpflanzung, Reizbarkeit, Wachstum und Evolution fähig sind.
3. : Biomasse: Stoffgemische, die in Lebewesen gebunden und/oder von ihnen erzeugt werden

Beispiel #2:

Definition des Begriffs "Lebewesen"

Organisierte Einheiten, die unter anderem zu Stoffwechsel, Fortpflanzung, Reizbarkeit, Wachstum und Evolution fähig

Code:

1. ; Definition des Begriffs "Lebewesen"
2. :Organisierte Einheiten, die unter anderem zu Stoffwechsel, Fortpflanzung, Reizbarkeit, Wachstum und Evolution fähig

Weitere Formatierungen

Um das wissenschaftliche Arbeiten zu erleichtern gibt es noch weitere Möglichkeiten Texte entsprechend auszuformatieren. Dies ist besonders dann wichtig, wenn wörtliche Zitate Verwendung finden, Gedichte analysiert werden sollen oder um bestimmte Sachverhalte für eine Diskussion anderwertig vom normalen Text hervorzuheben.

Textblock

Textblöcke bieten sich in der Regel dann an, wenn bestimmte Informationen vom restlichen Text abgehoben dargestellt werden sollen und wofür die einfachen textgestalterischen Mittel nur unzureichend geeignet sind. Ein häufiger auftretendes Beispiel ist die Ankündigung einer Veranstaltung innerhalb eines Nachrichtentextes bei der man sicherstellen möchte, dass sie auf den ersten Blick wahrgenommen wird.

Der Textblock kann auf zweierlei Arten erzeugt werden. Eine etwas umständliche Möglichkeit ist das Einrücken des entsprechenden Textes mit vier Leerzeichen     Text. Diese Möglichkeit empfiehlt sich meist nur bei einzeiligen Text. Umfasst der hervorzuhebende Text mehrere Sätze empfiehlt sich die Möglichkeit mittels des <pre> </pre> Tags.

Zu beachten ist, dass der Textblock am Ende der Zeile nicht automatisch umgebrochen wird. Ist der Text also länger als der anzuzeigende Bereich wird unter dem Block ein horizontaler Scrollbalken eingeblendet. Besonders problematisch ist dies im Verbund mit Bildern, die auf der selben Höhe des Textblockes abgebildet werden und für die der Textflussmodus aktiviert sein soll.

Beispiel für einzeiliger Textblock:

   Erste Zeile

Code:

1.     Erste Zeile

Beispiel für mehrzeiligen Textblock:

Ein ganz simpler Textblock,
der über mehrere Zeilen geht

Und wenn dieser Block sehr viele Zeilen umfasst,
könnte das echt anstrengend werden,
wenn man jede Zeile mit vier Leerzeichen
erst einrücken muss.

Code:

1. <pre>
2. Ein ganz simpler Textblock,
3. der über mehrere Zeilen geht
4.  
5. Und wenn dieser Block sehr viele Zeilen umfasst,
6. könnte das echt anstrengend werden,
7. wenn man jede Zeile mit vier Leerzeichen
8. erst einrücken muss.
9. </pre>

Beispiel für einzeiligen Textblock, welcher über den Anzeigebereich hinaus geht:

   Dies ist ein Satz der sehr lang ist und über den Anzeigebereich hinaus geht. Es wird der erwähnte Scrollbalken eingeblendet, welcher eventuell nicht ganz schön ist. Vor allem könnte er auf mobilen Geräten Probleme bei der Darstellung erzeugen und umständlich zu bedienen sein. Probleme treten auf jeden Fall auf, wenn rechts vom Textblock auf selber Höhe ein Bild eingeblendet wird.

Code:

1.     Dies ist ein Satz der sehr lang ist und über den Anzeigebereich hinaus geht. Es wird der erwähnte Scrollbalken eingeblendet, welcher eventuell nicht ganz schön ist. Vor allem könnte er auf mobilen Geräten Probleme bei der Darstellung erzeugen und umständlich zu bedienen sein. Probleme treten auf jeden Fall auf, wenn rechts vom Textblock auf selber Höhe ein Bild eingeblendet wird.

Zitate

Die Verwendung von Zitaten gehört zur Grundausbildung von [angehenden] Akademikerinnen / Akademikern und aus Fremdtexten übernommene Passagen müssen dementsprechend gekennzeichnet werden (weitere Informationen zum wissenschaftlichen Arbeiten siehe den Artikel Allgemeine Hinweise zum wissenschaftlichen Arbeiten).

Es gibt zwei unterschiedliche Befehle für das zitieren deren Unterschiede darin bestehen, dass das Zitat endweder im Satz steht oder nicht.

Beispiel zu einem Zitat im Satz: Ein „kurzer zitierter Text“

, auch mitten im Satz. Stattdessen kann man die Anführungszeichen auch direkt eingeben.

Code:

1. Ein {{"|kurzer zitierter Text}}, auch mitten im Satz. (Stattdessen kann man die Anführungszeichen auch direkt eingeben.)

Hinweis: Zitate dieser Form werden über die Vorlage:" realisiert. Vorlage arbeitet momentan fehlerhaft

Beispiel zu freistehenden Zitat:

「寧我負人，毋人負我。」

「Nìng wǒ fù rén, wú rén fù wǒ」

„Ich möchte lieber andere betrügen, als dass andere mich betrügen“

– Cao Cao: Angebliches Zitat aus dem Roman Geschichte der Drei Reiche, das Cao Caos Rücksichtslosigkeit unterstreichen soll

Code:

1. {{Zitat
2. | Text        = 寧我負人，毋人負我。
3. | Autor       = Cao Cao
4. | lang        = zh
5. | Umschrift   = Nìng wǒ fù rén, wú rén fù wǒ
6. | Übersetzung = Ich möchte lieber andere betrügen, als dass andere mich betrügen
7. | Quelle      = Angebliches Zitat aus dem Roman Geschichte der Drei Reiche, das Cao Caos Rücksichtslosigkeit unterstreichen soll
8. | vor         = 「
9. | nach        = 」
10. }}

Hinweis: Zitate dieser Form werden über die Vorlage:Zitat realisiert.

Formatierung Gedichten und ähnlichen Textformen

Soll im Text die in Versform vorliegen, wie Gedichte oder Liedtexte, abgebildet werden, wird empfohlen den eigens dafür im Befehlssatz des mediaWikis vorhandenen Tag <poem> </poem> zu verwenden. Dieser Formatiert die entsprechenden Zeilen.

Beispiel: Erste Strophe und er Refrain der Deutsche Arbeiter-Marseillaise von Jacob Audorf

Wohlan, wer Recht und Wahrheit achtet,
zu unsrer Fahne steh allzuhauf!
Wenn auch die Lüg uns noch umnachtet,
bald steigt der Morgen hell herauf!
Ein schwerer Kampf ist’s den wir wagen,
zahllos ist unsrer Feinde Schar.
Doch ob wie Flammen die Gefahr
mög über uns zusammenschlagen,

    Refrain

    nicht fürchten wir den Feind,
    stehn wir im Kampf vereint!
    Marsch, marsch, marsch, marsch
    und sei’s durch Qual und Not,
    für Freiheit, Recht und Brot!

[...]

Code:

1. <poem>
2. Wohlan, wer Recht und Wahrheit achtet,
3. zu unsrer Fahne steh allzuhauf!
4. Wenn auch die Lüg uns noch umnachtet,
5. bald steigt der Morgen hell herauf!
6. Ein schwerer Kampf ist’s den wir wagen,
7. zahllos ist unsrer Feinde Schar.
8. Doch ob wie Flammen die Gefahr
9. mög über uns zusammenschlagen,
10.  
11.     Refrain
12.  
13.     nicht fürchten wir den Feind,
14.     stehn wir im Kampf vereint!
15.     Marsch, marsch, marsch, marsch
16.     und sei’s durch Qual und Not,
17.     für Freiheit, Recht und Brot!
18.  
19. [...]
20. </poem>

Codeblock

Mittels eines Codeblocks (<code> </code>) kann Text in Schreibmaschinenschrift dargestellt werden. Eine Alternative zum Befehl <code> </code> ist der Befehl <tt> </tt>.

Anmerkung: Zu beachten ist, dass Leerzeichen das Aussehen verändern. Darüber hinaus ist die Darstellungsform für Quellcode ungünstig. Es empfiehlt sich stattdessen die Darstellung mittels Syntaxhighlighting, da diese unter anderem auch eine Nummerierung der Zeilen sowie die farbliche Hervorhebung (das sogenannte Syntaxhighlighting) unterstützt. Sowohl <code> </code> als auch <tt> </tt> werden mittlerweile als veraltet betrachtet und sollten nach Möglichkeit vermieden werden, da die Untersütztung für diese Befehle auf Dauer nicht garantiert ist.

Beispiele: Mehrzeiliger Codeblock ohne vorangehende Leerzeichen mittels <code></code>

Prozedure Kekse() { Ausgabe: Du wollen Kekse? }

Code:

1. <code>
2. Prozedure Kekse() {
3. Ausgabe: Du wollen Kekse?
4. }
5. </code>

Mehrzeiliger Codeblock mit vorangehende Leerzeichen <code></code>:

HTML Grundgerüst: Anfang

  
   
  
  
   Ein Körper!
  
 

Ende

Code:

1. <code>
2. HTML Grundgerüst:
3. Start
4.  <html>
5.   <head>
6.    <title>Titelangabe</title>
7.   </head>
8.   <body>
9.    Ein Körper!
10.   </body>
11.  </html>
12. Ende
13. </code>

Mehrzeiliger Codeblock ohne vorangehende Leerzeichen mittels <tt></tt>

Prozedure Kekse() { Ausgabe: Du wollen Kekse? }

Code:

1. <tt>
2. Prozedure Kekse() {
3. Ausgabe: Du wollen Kekse?
4. }
5. </tt>

Mehrzeiliger Codeblock mit vorangehende Leerzeichen <tt></tt>:

HTML Grundgerüst: Anfang

  
   
  
  
   Ein Körper!
  
 

Ende

Code:

1. <tt>
2. HTML Grundgerüst:
3. Start
4.  <html>
5.   <head>
6.    <title>Titelangabe</title>
7.   </head>
8.   <body>
9.    Ein Körper!
10.   </body>
11.  </html>
12. Ende
13. </tt>

Quellcode mit Syntaxhighlighting

Unter Syntaxhighlighting wird das Hervorheben von Befehlen der jeweiligen Sprache durch farbliche oder textgestalterische Elemente bezeichnet. Es bietet sich vor allem dann an, wenn mit real existierenden Programmiersprachen gearbeitet wird und Erklärungen oder Beispiele in einer dieser Sprachen dargestellt werden soll.

HTML-spezifische Befehle

Es ist möglich einige HTML-Tags innerhalb der Artikel zu verwenden. Die Verwendung hat Vor- und Nachteile. So erweitern sie die Gestaltungsmöglichkeiten von Texten, stellen aber für NutzerInnen ohne HTML-Kenntnisse aber eine Hürde da. Zudem können HTML-Tags die Les- und Wartbarkeit des Artikelcodes beeinträchtigen.

Erzwungene Zeilenumbrüche

Manchmal kann es nützlich sein einen Zeilenumbruch per Befehl zu erzwingen. Der dafür notwendige Befehl lautet <br> bzw. in der XHTML-Schreibweise <br /> und steht für break. Der Befehl ist ein strikter unary Tag, also ein alleinstehender Befehl ohne schließenden Tag! Die Verwendung von <br></br> führt zu einem Zeilenumbrüche nach dem <br>, aber das </br> wird als normaler Text aufgefasst und angezeigt.

Beispiel: Dieser Text
soll Umgebrochen
werden</br>.

Code:

1. Dieser Text<br />soll
2. Umgebrochen<br>werden</br>.

Anhand des Beispiels kann folgendes erkannt werden:

1. Der Zeilenumbruch wird nach
   (XHTML bzw. HTML5 Variante) und
   (HTML4 Variante) erzwungen.
2. Der Zeilenumbruch nach soll im Wikicode wird ignoriert, der Text wird also nicht in einer neuen Zeile angezeigt.
3. Der Befehl </br> bleibt wirkungslos und wird als normaler Text interpretiert.

Geschützte Leerzeichen

Geschützte Leerzeichen finden immer dann Anwendung, wenn ein Leerzeichen erzwungen werden soll. Ebenfalls werden diese genutzt um zu vermeiden, dass zusammenhängende Textteile durch einen Zeilenumbruch getrennt werden. Der Steuerbefehl dafür lautet &nbsp;.

Beispiele:
Mehrere Leerzeichen erzwingen:     4    Leerzeichen    

Code:

1. <kbd>&nbsp;&nbsp;&nbsp;&nbsp;4&nbsp;&nbsp;&nbsp;&nbsp;Leerzeichen&nbsp;&nbsp;&nbsp;&nbsp;</kbd>

Beispiele für zusammenhängende Textkomponenten: Ein Beispiel, um zu verdeutlichen, dass 10 kg oder 100 t auch Dr. med. Soundso ebenso wie die 1 . 000 . 000 kt zusammenhängend bleiben.

Code:

1. Ein Beispiel, um zu verdeutlichen, dass 10&nbsp;kg oder 100&nbsp;t auch Dr.&nbsp;med.&nbsp;Soundso ebenso wie die 1&nbsp;.&nbsp;000&nbsp;.&nbsp;000&nbsp;kt zusammenhängend bleiben.

Hinweis: Das letzte Beispiel zeigt nur die Verwendung nicht aber den Effekt an. Das geschützte Leerzeichen würde aber dafür sorgen, dass die zusammenhängenden Komponenten automatisch zusammen in der nächsten Zeile ausgegeben werden. Der Effekt lässt sich wegen den unterschiedlichen Bildschirmgrößen und daraus resultierenden Anzeigeweiten nicht genau simulieren.

Kommentare im Text

HTML Kommentare werden vom mediaWiki Parser ignoriert und können verwendet werden, wenn bestimmte Textpassagen mit Kommentaren versehen werden sollen. Die Verwendung sollte nach Möglichkeit nur in Vorlagen oder Seiten mit strukturellen Aufgaben genutzt werden, da in HTML ungeübte BenutzerInnen sonst wohlmöglich damit nichts anfangen können.

Beispiel: In diesem Satz ist ein Kommentar enthalten.

Code:

1. In diesem Satz <!-- verstecken wir ein wenig Text der nicht angezeigt werden soll --> ist ein Kommentar enthalten.

Attribute bei Tags verwenden

Über Attribute können...