BBCode-Anleitung

Einführung

Was ist BBCode?
BBCode ist eine spezielle Umsetzung von HTML. Ob du BBCode in deinen Beiträgen auf diesem Board verwenden kannst, wird durch die Board-Administration festgelegt. Sofern du es verwenden darfst, kannst du es auch im Beitrags-Formular für diesen Beitrag deaktivieren. BBCode ist ähnlich wie HTML aufgebaut, Tags werden von eckigen Klammern („[“ und „]“) statt spitzen („<“ und „>“) eingeschlossen und erlauben eine bessere Kontrolle, was und wie etwas angezeigt wird. Je nach verwendetem Template wirst du über dem Bereich für den Nachrichtentext Schaltflächen finden, die dir die Verwendung von BBCode vereinfachen werden. Aber selbst dann kann die folgende Anleitung für dich hilfreich sein.
Nach oben

Formatierung von Text

Wie fetter, kursiver und unterstrichener Text erstellt wird
BBCode enthält Tags, die dir eine schnelle Formatierung deines Textes ermöglichen. Dies wird folgendermaßen gemacht:
  • Um einen Text Fett zu machen, schließe ihn in [b][/b] ein. So wird z. B.

    [b]Hallo[/b]

    zu Hallo
  • Zum Unterstreichen von Text benutze [u][/u]. So wird z. B. aus:

    [u]Guten Morgen[/u]

    Guten Morgen
  • Um Text kursiv zu stellen, verwende [i][/i]. So wird z. B.

    Das ist [i]großartig![/i]

    zu Das ist großartig!
Nach oben
Wie die Textfarbe oder -größe geändert wird
Um die Farbe oder die Größe deines Textes zu ändern, können die folgenden Tags genutzt werden. Beachte dabei bitte, dass es von dem Browser und dem System der Betrachter abhängig ist, wie die Darstellung des Textes erfolgt:
  • Die Farbe des Textes wird geändert, in dem er in [color=][/color] eingeschlossen wird. Du kannst entweder eine den Browsern bekannte Farbe wie z. B. red, blue, yellow, etc. angeben oder einen Farbwert aus drei zweistelligen Hexadezimalwerten wie #FFFFFF, #000000 verwenden. Um beispielsweise roten Text zu erstellen:

    [color=red]Hallo![/color]

    oder

    [color=#FF0000]Hallo![/color]

    Beides ergibt Hallo!.
  • Die Textgröße wird in ähnlicher Weise mit [size=][/size] geändert. Dieser Tag ist abhängig von dem Template, das der Benutzer ausgewählt hat, aber die empfohlene Angabe ist ein numerischer Wert, der die Textgröße in Prozent angibt – beginnend standardmäßig mit 20 (sehr klein) und endend mit 200 (sehr groß). Zum Beispiel:

    [size=30]KLEIN[/size]

    wird gewöhnlich KLEIN sein,

    während:

    [size=200]GROSS![/size]

    GROSS! sein wird
Nach oben
Kann ich Tags zur Formatierung kombinieren?
Natürlich kannst du das. Um z. B. die Aufmerksamkeit eines anderen zu erhalten, kannst du

[size=200][color=red][b]SCHAU MICH AN![/b][/color][/size]

schreiben, was als SCHAU MICH AN! ausgegeben wird.

Wir empfehlen jedoch nicht, viel Text derart zu formatieren! Beachte, dass du als Autor dafür verantwortlich bist, dass die Tags richtig geschlossen werden. Zum Beispiel ist das hier falsch:

[b][u]Das ist falsch[/b][/u]
Nach oben

Zitieren und Ausgabe von Text mit fester Weite

Text in Antworten zitieren
Es gibt zwei Arten, Text zu zitieren: mit Quelle und ohne.
  • Wenn du die „Mit Zitat antworten“-Funktion zur Antwort auf einen Beitrag verwendest, wirst du feststellen, dass der alte Beitragstext von [quote=""][/quote] umschlossen zum Nachrichtentext hinzugefügt wird. Dies erlaubt dir unter Angabe einer Referenz zu einer Person oder zu etwas anderem von dir gewähltem zu zitieren. Um z. B. einen Text von Herrn Klecks zu zitieren, solltest du Folgendes eingeben:

    [quote="Herr Klecks"]Der Text von Herrn Klecks würde hier stehen[/quote]

    Bei der Ausgabe wird dem Text automatisch „Herr Klecks hat geschrieben:“ vorangestellt. Beachte, dass du den Namen in Anführungszeichen ("") einschließen musst, sie sind nicht optional.
  • Die zweite Methode erlaubt dir, etwas ohne Quellangabe zu zitieren. Dazu musst du den Text in [quote][/quote] einschließen. Wenn du die Nachricht anschaust, wird der Text in einem Zitat-Block angezeigt.
Nach oben
Programmcode oder Daten mit fester Weite ausgeben
Wenn du einen Auszug eines Programmcodes oder etwas anderes, das eine feste Textweite wie eine Courier-Schrift benötigt, eingeben möchtest, solltest du den Text in [code][/code] einschließen, z. B.

[code]echo "Das ist ein Stück Programmcode";[/code]

Alle Formatierungen, die innerhalb von [code][/code] genutzt werden, bleiben erhalten, wenn der Text betrachtet wird.
Nach oben

Listen erstellen

Eine unsortierte Liste erstellen
BBCode unterstützt zwei Arten von Listen: unsortierte und sortierte. Sie sind im Wesentlichen identisch zu ihren HTML-Entsprechungen. Eine unsortierte Liste gibt die Elemente deiner Liste hintereinander durch einen Aufzählungspunkt gekennzeichnet aus. Verwende [list][/list], um eine unsortierte Liste zu erstellen und beginne jeden Aufzählungspunkt mit [*]. Um zum Beispiel deine Lieblingsfarben aufzulisten, verwende:

[list]
[*]Rot
[*]Blau
[*]Gelb
[/list]

Dies würde folgende Liste ergeben:
  • Rot
  • Blau
  • Gelb

Alternativ kannst du auch den Listenpunkt-Stil definieren: [list=disc][/list], [list=circle][/list] oder [list=square][/list].
Nach oben
Eine sortierte Liste erstellen
Die zweite Listenart, die sortierte Liste, erlaubt dir, festzulegen, was den Punkten vorangestellt wird. Um eine sortierte Liste zu erstellen, verwende [list=1][/list] für eine nummerierte oder alternativ [list=a][/list] für eine alphabetische Liste. Wie bei der unsortierten Liste wird jeder Punkt durch [*] festgelegt. Zum Beispiel:

[list=1]
[*]Gehe einkaufen
[*]Kaufe einen neuen Computer
[*]Verfluche den Computer, wenn er abstürzt
[/list]

würde ergeben:
  1. Gehe einkaufen
  2. Kaufe einen neuen Computer
  3. Verfluche den Computer, wenn er abstürzt
Eine alphabetische Liste würdest du hingegen wie folgt erstellen:

[list=a]
[*]Die erste mögliche Antwort
[*]Die zweite mögliche Antwort
[*]Die dritte mögliche Antwort
[/list]

ergibt
  1. Die erste mögliche Antwort
  2. Die zweite mögliche Antwort
  3. Die dritte mögliche Antwort

[list=A]
[*]Die erste mögliche Antwort
[*]Die zweite mögliche Antwort
[*]Die dritte mögliche Antwort
[/list]

ergibt
  1. Die erste mögliche Antwort
  2. Die zweite mögliche Antwort
  3. Die dritte mögliche Antwort

[list=i]
[*]Die erste mögliche Antwort
[*]Die zweite mögliche Antwort
[*]Die dritte mögliche Antwort
[/list]

ergibt
  1. Die erste mögliche Antwort
  2. Die zweite mögliche Antwort
  3. Die dritte mögliche Antwort

[list=I]
[*]Die erste mögliche Antwort
[*]Die zweite mögliche Antwort
[*]Die dritte mögliche Antwort
[/list]

ergibt
  1. Die erste mögliche Antwort
  2. Die zweite mögliche Antwort
  3. Die dritte mögliche Antwort
Nach oben

Links erstellen

Links auf eine andere Website
phpBBs BBCode unterstützt mehrere Wege, um URIs (Uniform Resource Indicators), auch als URLs oder Links bekannt, zu erstellen.
  • Der erste davon ist der [url=][/url]-Tag; alles, was du nach dem =-Zeichen angibst, wird als Link für den Inhalt des Tags verwendet. Um beispielsweise auf phpBB.de zu linken, kannst du folgenden Code verwenden:

    [url=https://www.phpbb.de/]Besuche phpBB.de![/url]

    Dies würde folgenden Link erstellen: Besuche phpBB.de! Die Seite wird abhängig von den Einstellungen des Browsers des Benutzers im gleichen oder in einem neuen Fenster geöffnet.
  • Wenn du möchtest, dass die URL selbst als Beschreibung angezeigt wird, kannst du dies wie folgt erreichen:

    [url]https://www.phpbb.de/[/url]

    Dies würde folgenden Link erstellen: https://www.phpbb.de/
  • phpBB hat zusätzlich eine Funktion, um Links automatisch zu erkennen. Diese Funktion wandelt jede syntaktisch korrekte URL in einen Link um, ohne dass du einen Tag oder sogar das führende https:// angeben musst. Wenn du zum Beispiel in deinem Text www.phpbb.de schreibst, so wird dies automatisch zu www.phpbb.de, sobald du die Nachricht betrachtest.
  • Die selbe Funktionalität steht auch bei E-Mail-Adressen zur Verfügung. Du kannst entweder eine Adresse explizit kennzeichnen; z. B.:

    [email]niemand@domain.tld[/email]

    Dies ergibt niemand@domain.tld. Oder du kannst direkt niemand@domain.tld in deiner Nachricht verwenden, was automatisch umgewandelt wird, wenn du die Nachricht anschaust.
Wie bei allen BBCode-Tags kannst du URLs all den anderen Tags wie [img][/img] (siehe nächsten Eintrag), [b][/b] usw. hinterlegen. Wie bei den Formatierungs-Tags liegt es an dir, die richtige Reihenfolge beim Öffnen und beim Schließen einzuhalten. So ist zum Beispiel:

[url=https://www.phpbb.com/][img]https://www.phpbb.com/theme/images/logos/blue/160x52.png[/url][/img]

nicht richtig und kann dazu führen, dass dein Beitrag gelöscht wird.
Nach oben

Bilder in Beiträgen anzeigen

Ein Bild zu einem Beitrag hinzufügen
phpBBs BBCode hat einen Tag, um Bilder in einem Beitrag einzufügen. Dabei müssen zwei wichtige Punkte beachtet werden: erstens mögen es viele Benutzer nicht, wenn viele Bilder in einem Beitrag enthalten sind und zweitens muss das Bild, das du anzeigen möchtest, bereits im Internet verfügbar sein (es darf also nicht nur auf deinem Computer liegen, sofern du ihn nicht als Webserver betreibst!). Um ein Bild anzuzeigen, musst du die URL, die auf das Bild verweist, mit dem [img][/img]-Tag umschließen. Zum Beispiel:

[img]https://www.phpbb.com/theme/images/logos/blue/160x52.png[/img]

Wie schon im Abschnitt über Links erwähnt, kannst du ein Bild auch innerhalb des [url][/url]-Tags verwenden:

[url=https://www.phpbb.com/][img]https://www.phpbb.com/theme/images/logos/blue/160x52.png[/img][/url]

ergibt:

Nach oben
Dateien zu einem Beitrag hinzufügen
Dateianhänge können nun mit dem neuen [attachment=][/attachment]-Tag an jeder Stelle eines Beitrags eingefügt werden, sofern Dateianhänge durch die Board-Administration zugelassen wurden und du ausreichende Rechte zur Erstellung eines Dateianhangs hast. Innerhalb des Formulars zur Beitragserstellung findest du eine Auswahlliste (oder eine Schaltfläche), um Dateianhänge innerhalb des Beitrags zu platzieren.
Nach oben

Andere Punkte

Kann ich meine eigenen Tags hinzufügen
Wenn du ein Administrator mit entsprechenden Rechten auf diesem Board bist, kannst du im Bereich für benutzerdefinierte BBCode-Tags weitere Tags definieren.
Nach oben

Advanced BBCode Box BBCodes

Schriftart
[font=Comic Sans MS]Text[/font]

Example:
[font=Comic Sans MS]The quick brown fox jumps over the lazy dog[/font]

Result:
The quick brown fox jumps over the lazy dog
Nach oben
Text hervorheben (Gelb)
[highlight=yellow]text[/highlight] Tipp: Du kannst auch color=#FF0000 benutzen

Example:
[highlight=yellow]The quick brown fox jumps over the lazy dog[/highlight]

Result:
The quick brown fox jumps over the lazy dog
Nach oben
Ausrichten von Text
[align=Zentrierter|Linksbündiger|Rechtsbündiger|Block]Text[/align]

Example:
[align=center]The quick brown fox jumps over the lazy dog[/align]

Result:
The quick brown fox jumps over the lazy dog
Nach oben
Umfließender Text (Links/Rechts)
[float=left|right]Text[/float]

Example:
[float=right]The quick brown fox jumps over the lazy dog[/float]

Result:
The quick brown fox jumps over the lazy dog
Nach oben
Text durchgestrichen
[s]Text[/s]

Example:
[s]The quick brown fox jumps over the lazy dog[/s]

Result:
The quick brown fox jumps over the lazy dog
Nach oben
Tiefgestellter Text
[sub]Text[/sub]

Example:
[sub]The quick brown fox jumps over the lazy dog[/sub] The quick brown fox jumps over the lazy dog

Result:
The quick brown fox jumps over the lazy dog The quick brown fox jumps over the lazy dog
Nach oben
Hochgestellter Text
[sup]Text[/sup]

Example:
[sup]The quick brown fox jumps over the lazy dog[/sup] The quick brown fox jumps over the lazy dog

Result:
The quick brown fox jumps over the lazy dog The quick brown fox jumps over the lazy dog
Nach oben
Glühender Text
[glow=color]Text[/glow]

Example:
[glow=red]The quick brown fox jumps over the lazy dog[/glow]

Result:
The quick brown fox jumps over the lazy dog
Nach oben
Text mit Schatten
[shadow=color]Text[/shadow]

Example:
[shadow=blue]The quick brown fox jumps over the lazy dog[/shadow]

Result:
The quick brown fox jumps over the lazy dog
Nach oben
Text mit Schattenfall
[dropshadow=color]Text[/dropshadow]

Example:
[dropshadow=blue]The quick brown fox jumps over the lazy dog[/dropshadow]

Result:
The quick brown fox jumps over the lazy dog
Nach oben
Unscharfer Text
[blur=color]Text[/blur]

Example:
[blur=blue]The quick brown fox jumps over the lazy dog[/blur]

Result:
The quick brown fox jumps over the lazy dog
Nach oben
Text ein-/ausblenden
[fade]Text[/fade]

Example:
[fade]The quick brown fox jumps over the lazy dog[/fade]

Result:
The quick brown fox jumps over the lazy dog
Nach oben
Vorformatierter Text
[pre]Text[/pre]

Example:
[pre]The quick brown fox jumps over the lazy dog The quick brown fox jumps over the lazy dog[/pre]

Result:
The quick brown fox jumps over the lazy dog
	The quick brown fox jumps over the lazy dog
Nach oben
Text Richtung (links nach rechts/rechts nach links)
[dir=ltr|rtl]Text[/dir]

Example:
[dir=rtl]The quick brown fox jumps over the lazy dog[/dir]

Result:
The quick brown fox jumps over the lazy dog
Nach oben
Lauftext (nach unten|oben|links|rechts)
[marq=up|down|left|right]text[/marq]

Example:
[marq=left]The quick brown fox jumps over the lazy dog[/marq]

Result:
The quick brown fox jumps over the lazy dog
Nach oben
Spoiler Nachricht
[spoil]Text[/spoil]

Example:
[spoil]The quick brown fox jumps over the lazy dog[/spoil]

Result:
► Text zeigen
Nach oben
Inhalt für Gäste verstecken
[hidden]Text[/hidden]

Example:
[hidden]The quick brown fox jumps over the lazy dog[/hidden]

Result:
Verstecken ist aktiviert
Um diesen versteckten Text lesen zu können, mußt du registriert und angemeldet sein.
Nach oben
Moderator Nachricht
[mod=username]text[/mod]

Example:
[mod="Benutzername"]The quick brown fox jumps over the lazy dog[/mod]

Result:
 ! Nachricht von: Benutzername
The quick brown fox jumps over the lazy dog
Nach oben
Off Topic Nachricht
[offtopic]Text[/offtopic]

Example:
[offtopic]The quick brown fox jumps over the lazy dog[/offtopic]

Result:
Off Topic
The quick brown fox jumps over the lazy dog
Nach oben
NFO ASCII-Art Text
[nfo]Text[/nfo]

Example:
[nfo]༼ つ ◕_◕ ༽つ ʕ•ᴥ•ʔ ¯\_(ツ)_/¯[/nfo]

Result:
༼ つ ◕_◕ ༽つ    ʕ•ᴥ•ʔ   ¯\_(ツ)_/¯
Nach oben
Füge ein Web Video hinzu
[bbvideo]http://Video URL[/bbvideo]

Example:
[bbvideo]http://www.youtube.com/watch?v=sP4NMoJcFd4[/bbvideo]

Result:
Nach oben