Wie benutze ich BBCode?

Allgemeines zu Zeilenumbrüchen, Absätzen und Leerzeichen

[Enter] im normalen Fließtext darf nur in Paaren vorkommen, wenn man einen richtigen Absatz erzeugen will. Vor jedem Block-Element muss zwei mal [Enter] gedrückt werden, da nur so ein neuer Absatz eingeleitet wird.

Einzelne [Enter], die beim Verfassen von Einträgen zur Begrenzung der Textbreite gesetzt werden, bleiben wirkungslos. Wie breit ein Text tatsächlich angezeigt wird, hängt einzig vom Browser des Besuchers ab. Lange URLs werden automatisch umgebrochen, auch hier ist kein [Enter] davor oder danach nötig.

Leerzeichen müssen vor und hinter jedem Inline-Element stehen. Innerhalb dieser Elemente dürfen Leerzeichen nur zwischen zwei Wörtern stehen, nicht aber direkt hinter dem einleitenden Tag.

Falsch:

[url=http://exapmle.org][Leerzeichen]Beispiel Link[Leerzeichen][/url]

Richtig:

[url=http://example.org]Beispiel Link[/url]

Die einzige Ausnahme von dieser Regel ist, wenn man nur einen Teil eines Wortes als etwas besonderes auszeichnen will. So ergibt folgende Kombination:

Inter[url=http://example.org]kommunikation[/url]smanagment

das Wort Interkommunikationsmanagment, in dem der Teil "kommunikation" als Hyperlink angezeigt wird.

Vor Satzzeichen kommt niemals ein Leerzeichen, sondern immer dahinter.

Links

Hyperlinks können mit oder ohne Beschreibung eingefügt werden. Wird keine Beschreibung angegeben, erscheint der Hyperlink so, wie er eingegeben wurde.

Beispiele

[url]http://example.org[/url]

wird zu

<a class='urllink' href='http://example.org' rel='nofollow'>http://example.org</a>

[url=http://example.org]Linkbeschreibung[/url]

wird zu

<a class='urllink' href='http://example.org' rel='nofollow'>Linkbeschreibung</a>

Betonung

• [i]betont[/i]
• [b]stark betont[/b]

Bilder

Grundsätzlich wird ein Bild so eingefügt: [img]1.jpg[/img] und ist ein Inline-Element, das keinen neuen Absatz erzeugt. Soll ein Bild von einem entfernten Server eingebunden werden, muss der vollständige URL angegeben werden (z.B. [img]http://example.org/pfad/zum/bild.jpg[/img]). Bitte beachten Sie, dass das Einbinden fremder Bilder u.U. als Trafficklau nicht gern gesehen wird.

Optionen für das Einbinden von Grafiken

[img class="klassenname"]1.jpg[/img]

Damit weisen Sie dem Bild eine CSS-Klasse zu, die Sie in der zentralen CSS-Datei festlegen müssen. Diese finden Sie standardmäßig unter jlog-homedir/personal/css/screen.css. Verschiedene Klassen sind durch Leerzeichen zu trennen.

[img alt="Alternativ Text"]1.jpg[/img]

Diese Option weist dem Bild einen Text zu, der dann angezeigt wird, wenn die Grafik aus irgendwelchen Gründen nicht geladen werden kann. Der Alternativtext sollte immer angegeben werden.

[img title="Tooltip Text"]1.jpg[/img] (bisher nur im SVN)

Diese Option weist dem Bild einen Text zu, der beim darüber verharren mit der Maus (meist) als Tooltip mit gelbem Hintergrund angezeigt wird.

[img caption="Bildunterschrift"]1.jpg[/img]

Das Attribut caption macht aus dem Bild eine Definitionsliste und somit ein Block-Element, der das class-Attribut anstelle des Bildes übergeben wird. Darüber hinaus bekommt die Definitionsliste auch noch die Breite des Bildes. Der ausgegebene HTML Code sieht dann in etwa so aus:

<dl class="photo fr" style="width: 200px;">
  <dt><img alt="Ein Pferd" style="width: 200px; height: 150px;" /></dt>
   <dd>Eine Bildunterschrift</dd>
  </dl>

Dies funktioniert jedoch nur bei Bildern, die über Jlog hochgeladen wurden.

Beispiel

[img class="fr" alt="Ein sehr großer Pferdekopf" caption="Mein Pferd ist das schönste"]http://jeenaparadies.net/img/weblog/pferd.jpg[/img]

Überschrift

Für Unterüberschriften gibt es den Tag [headline]

Listen

Sowohl vor als auch nach einer Liste muss eine Leerzeile stehen, damit die Listen auch als solche erkannt und korrekt dargestellt werden.

Ungeordnete Liste

[list]
[*]erster Punkt
[*]zweiter Punkt
[*]dritter Punkt
[/list] 

Ergibt:

<ul>
  <li>erster Punkt</li>
  <li>zweiter Punkt</li>
  <li>dritter Punkt</li>
</ul>

Nummerierte Liste

Genau so wie bei der ungeordneten, mit der Ausnahme, dass anstatt [list], [olist] verwendet wird. Das Ergebniss sieht dann so aus:

<ol>
  <li>erster Punkt</li>
  <li>zweiter Punkt</li>
  <li>dritter Punkt</li>
</ol>

Zitate

Bitte nach [quote] kein Leerzeichen und auch keinen Zeilenumbruch einfügen. Genau so bei [/quote] keinen davor.

[quote]Ich bin ein Zitat welches nur dazu da ist um zu zeigen wie das alles hier so geht.
Und aber auch dazu um zu zeigen dass es mehrere Zeilen sein können.

Oder auch mehrere Absätze wie in diesem Beispiel hier.[/quote]

HTML

Alles innerhalb von [html][/html] wird als HTML-Code ausgewertet, nicht nach den BBCode-Regeln. Sie sollten mit dem Einsatz vorsichtig sein, da hier die Regeln des HTML-Standards gelten. Auch erzeugt [html] keinen neuen Block, d.h. dieser „Tag“ wird inline wirksam.