Yogalehrer Online Befehlsübersicht Allgemeines

Transcription

Yogalehrer Online Befehlsübersicht
www.yoglehrer-online.de
Befehlsübersicht
Das sind die Befehle, die man im Editor verwenden kann
Versionen:
Änderungen
Versionsnummer
Stand
Ursprungsversion
1.00
19. Mai 2010
audio, divid, dia, ecall, skype,
icq, google-translator
1.01
24. November 2012
Allgemeines
Die hier aufgeführten Befehle ersetzen meistens ähnlich lautende HTML-Befehle. Es gibt aber auch
Befehle, die es sonst nirgends gibt und die nützliche Funktionen in die Webseite rufen, wie z.B. der
Befehl „[stundenplan]“.
Wer in Foren unterwegs ist, kennt vielleicht schon einige der Befehle, wie z.B. „[b]“, um Wörter
fett auszugeben. Diese Art der Befehle nennt man „bulletin-board-code“ (Forum-Code) oder
schlicht „BBCode“.
Warum hat Yogalehrer-Online keinen zeitgemäßen, grafischen Editor?
Das ist eine gute Frage. Jeder, der hier zum ersten Mal hinkommt, stellt sich vermutlich genau diese
Frage. Die Antwort:
Yogalehrer-Online hat keinen grafischen Editor mehr.
Experimente mit diversen, vielversprechenden grafischen Editoren brachten alle das selbe Ergebnis:
Eine immer mehr zunehmende,
nicht mehr behebbare „Vermüllung“
des Quelltextes der Seiten.
Immer mehr Fehler, die zum Schluß dazu führten, dass sich entweder der Browser aufhing oder die
Seite nur in Teilen, aber in jedem Fall nicht so wie erwartet, angezeigt wurde.
Seite 1 von 38
Mit BBCode hat man die Chance, seine Fehler wieder zu beheben.
Mit grafischen Editoren nicht.
Die allgemeine Syntax (Sprachregeln) von BBCode
BBCode hält sich im allgemeinen an das Vorbild HTML. Es gilt die Reihenfolge:
[Anfangsbefehl] – zu formatierender Text – [/Endbefehl]
Der Endbefehl lautet wie der Anfangsbefehl, hat aber einen Schrägstrich.
Beginn der Formatierung:
Eckige Klammer auf
Befehlskürzel
[
B
Optionale Argumente
Eckige Klammer zu
]
--- zu formatierender Text --Ende der Formatierung:
Eckige Klammer auf
Schrägstrich
Befehlskürzel
Eckige Klammer zu
[
/
B
]
Beispiel:
Das ist [b] fettgeschriebener Text [/b]. Normaler Text.
Ergebnis:
Das ist fettgeschriebener Text. Normaler Text.
Die Faulenzer-Syntax von Yogalehrer-Online
Manche Befehle haben einen „Faulenzer-Modus“. Hierbei umschließen die eckigen Klammern den
gesamten, zu formatierenden Bereich.
Beispiel:
Das ist [b fettgeschriebener Text]. Normaler Text.
Die Faulenzer-Syntax ist nicht so bekannt wie die normale Syntax. Es gibt sie in Yogalehrer-Online,
weil sie die Arbeit mit den Webseiten beschleunigen kann und übersichtlich aussieht.
Seite 2 von 38
In der nun folgenden Befehlsübersicht werden die Faulenzer mit ausgegeben. Das Zurechtklicken
der Befehle mit dem Editor erzeugt immer den offiziellen Code, die Faulenzer sind nur über die
Handeingabe möglich. Den Faulenzer gibt es nur für ein paar häufig gebrauchte Befehle.
Stichwortverzeichnis
A
F
audio......................5
f..............................13
fieldset.............13
flag.......................14
B
b................................5
big...........................5
bild.........................6
bildgalerie........6
block......................7
C
center....................7
code.........................8
D
dia...........................8
div...........................9
divbox....................9
divclass...........10f.
divid....................11
download.............12
E
ecall....................12
email....................13
G
gbild....................14
goname..................16
googletranslator........15
H
lbild....................20
left.......................21
lgbild..................21
li...........................22
lkontakt.............22
lmap.......................23
lrollbox...........23f.
rrollbox.............30
M
T
map.........................24
N
h1...........................16
h2...........................17
h3...........................17
hr...........................17
html.......................17
name....................24f.
I
R
i..............................18
K
k..............................18
kontakt.............18f.
kurse....................19
L
O
S
small....................31
stop.......................31
stundenplan......31
style....................32
styleclass........33
table....................33
td.....................34, 37
termine.............34f.
tr...........................35
orte....................25f.
U
Q
u..............................36
url.......................36f.
q..............................26
rbild....................26
rgbild..................27
right....................28
rkontakt...........28f.
rmap.......................29
rollbox...............30
W
wiki.......................37
................................4
!
!................................4
Seite 3 von 38
BBCode
HTML-Entsprechung
!(Buchstabe)
(Leerzeichen)
Ergebnis
Großer Erstbuchstabe
Beispiel:
!G roße !A nfangsbuchstaben
Ergebnis:
Große Anfangsbuchstaben (Das Aussehen des Ergebnisses ändert sich in jedem Design)
Erklärung:
Ein Ausrufezeichen wird ohne Zwischenraum an einen Buchstaben gestellt. Danach kommt ein
Leerzeichen. Technik: Dadurch wird der Buchstabe mit der CSS-Klasse „firstletter“ ausgestattet.
Abhängig vom gewählten Design sieht der Buchstabe dann jeweils anders aus. Das Aussehen der
Klasse „firstletter“ kann im CSS-Modul geändert werden.
[ ]
 
Hartes Leerzeichen
Erklärung:
Normalerweise werden alle aufeinander folgenden Whitespace-Zeichen wie Leerzeichen,
Zeilenumbrüche oder Tabulatoren im Browser zu einem einzigen Leerzeichen komprimiert. Das
macht nicht etwa Yogalehrer-Online, das machen alle Browser so. Es ist eine Vorgabe in der
Definition von HTML. Die Browser müssen das so machen, es ist eine Vorschrift. Das harte
Leerzeichen   wird nicht komprimiert, es gilt nicht als Whitespace-Zeichen, sondern als
Buchstabe. Benutze das harte Leerzeichen, um Abstände zwischen einzelne Worte zu bekommen:
Beispiel:
Ich brauche mehr[][][][]Abstand
Ergebnis: Ich brauche mehr
Abstand
Falsch:
Ich brauche mehr
Abstand
Ergebnis: Ich brauche mehr Abstand
Seite 4 von 38
BBCode
HTML-Entsprechung
Ergebnis
[audio …]
<audio>
Sound in der Webseite
So funktioniert der Audio-Befehl:
Den Sound als *.ogg UND als *.mp3 hochladen in den
Arbeitsbereich > Homepage > Downloads.
Die beiden Formate hochzuladen ist wichtig, um alle Browser mit im Boot zu haben. Mit diesen beiden Formaten
hat man alle Eventualitäten abgedeckt.
Mit dem Befehl
[audio <Dateiname>] wird dieser Download dann aber noch nicht abgespielt. Er ist schon mal in der
Webseite - aber das hat keinerlei Auswirkungen.
Damit es von alleine losgeht, muss noch "autoplay" dazu. Also
[audio autoplay <Dateiname>]
Ein endloses Abspielen mit "loop"
[audio autoplay loop <Dateiname>]
Mit Abspielknopf zum Draufdrücken:
[audio controls <Dateiname>]
Der Befehl schaut nach beiden Endungen, deshalb geht [audio] auch mit dem Dateinahmen ohne Endung.
[b] … text … [/b]
[b … text … ]
<b>
Fetter Text
Beispiele:
[b]dieser Text wird fettgeschrieben[/b]
[b dieser Text wird fettgeschrieben]
[big] … text … [/big] <big>
[big … text … ]
Text etwas größer machen
Erklärung:
[big] macht den Text etwas größer, als er im Moment ist.
Beispiel:
Seite 5 von 38
BBCode
HTML-Entsprechung
Ergebnis
Das ist normaler Text. [big] Dieser Text wird etwas größer. [/big] Das ist normaler Text.
Das ist normaler Text. [big Dieser Text wird etwas größer.] Das ist normaler Text.
Aussehen:
Das ist normaler Text. Dieser Text
[bild (Bildnummer)]
wird etwas größer. Das ist normaler Text.
<img>
Bild als eigene Zeile einbauen
Erklärung:
Das Bild muss vorher auf der Seite, auf der es verwendet werden soll, hochgeladen werden. Die
Bildnummer steht dann in der Übersicht der hochgeladenen Bilder an jedem Bild dran. Jede Seite
mit hochgeladenen Bildern hat ein eigenes „Bild 1“. So wird das erste Bild eingebaut:
Beispiel:
Aussehen:
[bild 1]
[bildgalerie
(Bildnummer)]
<img>+Javascript+CSS
Vorschau-Dia für Galeriebild
mit jQuery-Lightbox. Schwebt
immer nach links.
Siehe auch: [stop]
Erklärung:
[bildgalerie] stellt ein Bild als Dia in eine Lightbox-Bildergalerie. Javascript muss aktiviert
sein. Die Bilder müssen vorher auf der Seite, auf der sie verwendet werden sollen, hochgeladen
werden. Die Bildnummer steht dann in der Übersicht der hochgeladenen Bilder an jedem Bild dran.
Jede Seite mit hochgeladenen Bildern hat ein eigenes „Bild 1“. Die Bilder sollten in der
größtmöglichen Größe hochgeladen werden, die Yogalehrer-Online zuläßt.
So werden die ersten drei Bilder als Dias gezeigt, die beim Draufklicken mit der jQuery-Lightbox
auf die hochgeladene Größe vergrößert werden:
Seite 6 von 38
BBCode
HTML-Entsprechung
Ergebnis
[bildgalerie 1][bildgalerie 2][bildgalerie 3]
Ergebnis:
Der Befehl „bildgalerie“ ist veraltet. Der neue Befehl „dia“ ist kürzer und kann das obige Ergebnis
mit deutlich weniger Schreibarbeit durch [dia 1-3] erzielen.
[block] … text …
[/block]
<div style=“textalign:justify“>
Blocksatz, Absatz wird rechtsund linksbündig gleichzeitig
Erklärung:
[block] macht sowohl die linke, als auch die rechte Kante des Absatzes „glatt“. So sieht der Text
in Büchern und Zeitungen aus.
Beispiel:
[block]Lorem ipsum dolor sit amet, consectetur adipiscing elit. In
tempus tortor sed dui fringilla ac imperdiet neque tristique.
Quisque dignissim massa in libero molestie posuere. In nec augue
orci, vel vulputate justo.[/block]
Aussehen:
Lorem ipsum dolor sit amet, consectetur adipiscing elit. In tempus tortor sed dui fringilla ac
imperdiet neque tristique. Quisque dignissim massa in libero molestie posuere. In nec augue orci,
vel vulputate justo.
Siehe auch: [left], [right] und [center]
[center] … text …
[/center]
<div style=“textalign:center“>
Absatz zentrieren
Erklärung:
[center] zentriert den eingeschlossenen Absatz.
Beispiel:
Seite 7 von 38
BBCode
HTML-Entsprechung
Ergebnis
[center]Lorem ipsum dolor sit amet, consectetur adipiscing elit.
In tempus tortor sed dui fringilla ac imperdiet neque tristique.
orci, vel vulputate justo.[/center]
Aussehen:
Siehe auch: [left], [right] und [block]
[code] … text …
[/code]
[code … text … ]
<code>
Schreibmaschinentext
Beispiele:
Das wird [code] Schreibmaschinentext [/code] werden.
Das wird [code Schreibmaschinentext] werden.
Aussehen:
Das wird Schreibmaschinentext werden.
[dia <nr>(-<nr>)]
Bildergalerie
Erklärung:
[dia] stellt ein oder mehrere Bilder als Dia-Show in eine Lightbox-Bildergalerie. Javascript muss
aktiviert sein. Die Bilder müssen vorher auf der Seite, auf der sie verwendet werden sollen,
hochgeladen werden. Die Bildnummer steht dann in der Übersicht der hochgeladenen Bilder an
jedem Bild dran. Jede Seite mit hochgeladenen Bildern hat ein eigenes „Bild 1“. Die Bilder sollten
in der größtmöglichen Größe hochgeladen werden, die Yogalehrer-Online zuläßt.
So werden die ersten drei Bilder als Dias gezeigt, die beim Draufklicken mit der jQuery-Lightbox
auf die hochgeladene Größe vergrößert werden:
[dia 1-3]
Seite 8 von 38
BBCode
HTML-Entsprechung
Ergebnis
Ergebnis:
Mit dem Befehl „bildgalerie“ kann man das selbe Ergebnis erzielen. Der Befehl „bildgalerie“ ist
aber veraltet. Um das selbe Ergebnis mit „bildgalerie“ zu haben, müsste man [bildgalerie
1][bildgalerie 2][bildgalerie 3] eingeben.
[div (style)] …
bereich … [/div]
<div>
Formatierter Layer
Erklärung:
[div] umschließt einen rechteckigen Bereich des sichtbaren Bereichs. Es ist die 1:1 –
Umsetzung des HTML-Befehls <div style= … style-Anweisungen … >
Wenn ein bestimmter Bereich einmalig (nicht wiederholend) formatiert werden soll. Alle CSSAnweisungen sind möglich.
Beispiel:
[div background-color:white;color:navy;padding:1em;border:solid
3px red]Das ist ein Bereich mit blauer Schrift und rotem Rand[/div]
Aussehen:
[divbox … caption … ] <div class=“divbox“><div 3 verschachtelte DIVclass=“divboxhead“><h2> Anweisungen, die äußere hat
… text … [/divbox]
… caption … </h2><div
die Klasse „divbox“
class=“divboxbody“> …
Erklärung:
[divbox] ist für werdende CSS-Experten, die Text in grafisch besonders ausgestalteten
Bereichen darstellen wollen. Durch die Verschachtelung ist es möglich, z. B. Grafiken mit runden
Ecken als Hintergrundbilder zu benutzen.
Im CSS-Modul müssen die Klassen „divbox“, „divboxhead“ und „divboxbody“ definiert
werden. Im Download-Modul müssen die grafischen Hintergrundbilder hinterlegt werden, auf die
Seite 9 von 38
BBCode
HTML-Entsprechung
Ergebnis
das CSS dann zugreift. Ist das CSS einmal definiert, kann man diese Box beliebig oft auf allen
Seiten verwenden. Damit man sieht, wie das gemeint ist, gibt es ein funktionerendes Beispiel mit
dem benötigten CSS und ein paar Grafiken, die man an seine eigenen Bedürfnisse anpassen kann.
Viele profesionelle Seiten nutzen ähnliche Techniken der Gestaltung von Informationskästchen. Es
ist deutlich mehr Firlefanz möglich, als nur runde Ecken!
Die Beschreibung der CSS-Technik: http://www.vertexwerks.com/tests/sidebox/
Beispiel:
[divbox Das ist eine DivBox]Das ist die Standard-Divbox in Gelb.
[/divbox]
Die Standard-Divbox, die eigentlich zu keinem Design wirklich gut passt, ist bereits definiert.
Bevor man sich den divbox-Lehrgang antut, sollte man divclass verstanden und erfolgreich
eingestzt haben.
Aussehen Standard-Divbox:
Die Standard-Divbox ist nur auf weißem
Hintergrund schön anzusehen, denn der
Hintergrund ist Teil des Bildes.
Mögliches Aussehen mit eigenem CSS:
Hintergrund: Das selbe Problem.
[divclass (Klasse)] … <div
text … [/divclass]
class=“(Klasse)“>
Eigene CSS-Klasse auf einen
rechteckigen Bereich wirken
lassen.
Erklärung:
Seite 10 von 38
BBCode
HTML-Entsprechung
Ergebnis
[divclass] holt beliebige, selbst definierte CSS-Klassen in die Webseiten. Die im CSS-Modul
definierten Klassen gelten für alle Webseiten. Im Gegensatz zu „id“ darf eine „class“ mehrmals auf
einer Seite vorkommen.
Eine Beispiel-Definition im CSS-Modul:
Aufruf im Seiteninhalt:
.wichtig{
background-color: white;
color: red;
padding: 1em;
font-size: 1.2em;
border: solid 3px navy;
text-align:center;
}
[divclass wichtig] Das hier ist
sehr wichtig![/divclass]
Aussehen:
Klassen werden im CSS mit einem Punkt eingeleitet. Der kleine Punkt vor „wichtig“ in der CSSDefinition macht das Wort „wichtig“ zu einer CSS-Klasse.
[divid <name>]
<div id=“name“>
HTML-Layer mit id
[divid] holt beliebige, selbst definierte CSS-ids in die Webseiten. Die im CSS-Modul
definierten ids gelten für alle Webseiten. Im Gegensatz zu CSS-Klassen müssen ids eindeutig sein
und dürfen pro Seite nur einmal vorkommen.
#wichtig{
color: red;
padding: 1em;
font-size: 1.2em;
text-align:center;
}
[divid wichtig] Das hier ist
sehr wichtig![/divid]
Aussehen:
Seite 11 von 38
BBCode
HTML-Entsprechung
Ergebnis
Eindeutige ids werden im CSS mit einem Lattenkreuz # eingeleitet. Das Lattenkreuz vor „wichtig“
macht das Wort zu einer eindeutigen id.
[download (Name)]
<a href=“...“>
Downloads zur Verfügung
stellen
Erklärung:
[download] stellt dem Seitenbesucher eine zuvor hochgeladene Datei zur Verfügung. Die Datei
muss zuerst unter Arbeitsbereich > Homepage > Downloads hochgeladen werden. Am unteren
Ende des Moduls hängt ein „Waschzettel“, in dem die aktuelle Anleitung zum Hochladen und
Benutzen von Downloads findet. In diesem Modul steht der Befehl zum Bereitstellen eines
Downloads in der Spalte „[download ...]“. Einfach in das Feld klicken, den Feldinhalt kopieren
und in dem Webseiteneditor an der gewünschten Stelle einfügen.
Beispiel:
Aussehen:
[download profiwissen.pdf]
[ecall <Telefonnummer>] <a href=“callto:...“>
Telefon-Link
Erklärung:
[ecall] erzeugt einen Telefonlink, der z.B. beim Aufruf der Seite über Mobiltelefon angeklickt
und damit gewählt werden kann.
Damit es immer und überall klappt, sollte die Telefonnummer mit +Landesvorwahl (+49 für
Deutschland) eingeleitet werden.
Beispiel:
[ecall +49 6136-850465]
erzeugt einen wählbaren Link aus der Telefonnummer des Yogalehrer-Online-Supports.
Auf Windows-System wird ein <a href=“callto:...“> - Link erzeugt. Auf allen anderen
Systemen wird ein <a href=“tel:...“> - Link erzeugt. Probleme bitte dem Support melden,
auch das verwendete Mobilfunk- oder Computerteil. Dann lassen wir den Befehl auch auf andere
Systeme reagieren.
Seite 12 von 38
BBCode
HTML-Entsprechung
Ergebnis
[email (Mailadresse)] <a href=“mailto:...“> Geschützter Email-Link
Erklärung:
[email] erzeugt einen Email-Link, der beim Anklicken das Mailprogramm des Seitenbesuchers
starten will. Der Link ist mit Javascript schwach gegen Email-Ernteskripte geschützt. Die meisten
Email-Ernter versuchen gar nicht, irgendeinen Schutz zu knacken, deshalb ist der damit gewährte
Schutz bei fast 100%. Allerdings: Die Email-Adresse kann natürlich von Hand übernommen oder
von Besuchern in ihr Adressbuch gesammelt werden. Viele Computerviren durchsuchen gezielt die
Adressbücher der befallenen Rechner nach Email-Adressen...
Beispiel:
[email [email protected]]
Aussehen ohne Javascript:
ganesha ( Bitte ein @ einfügen ) yogalehrer-online.de
Aussehen mit Javascript:
[email protected]
[f] … text … [/f]
<b>
Fetter Text
Beispiele:
[f]dieser Text wird fettgeschrieben[/f]
[f dieser Text wird fettgeschrieben]
[fieldset
(Bezeichnung)]
<fieldset><legend>
Umrandung mit Bezeichnung
um Inhalte
Erklärung:
Mit [fieldset] kann man einen Bereich umranden. Die Bezeichnung des umrandeten Bereichs
steht dann oben links in der Umrandung drin.
Beispiel:
[fieldset Überschrift]Das ist ein umrandeter Bereich mit
Überschrift[/fieldset]
Aussehen:
Seite 13 von 38
BBCode
HTML-Entsprechung
Ergebnis
[flag <code> <size>]
<img>
Eine kleine Flagge
Erklärung:
[flag] gibt eine kleine Flagge aus. Damit kann man im Text z. B. Fremdsprachige Abschnitte
markieren. Der Code ist der gleiche Wert, wie er auf den Nationalitätsplaketten von
Kraftfahrzeugen steht. Size ist die Höhe der Flagge (die Breite ändert sich ebenfalls). Erlaubt sind
Größen von 8 bis 20. Werden größere oder kleinere Werte angegeben, dann wird auf den erlaubten
Wert eingeschränkt. Die Flagge ist 35 Pixel breit und 20 Pixel hoch.
Beispiele:
[flag d12] [flag gb12] [flag f12]
[flag se 20] [flag e 111]
Aussehen:
[gbild (Bildnummer)]
<img>
Yogalehrer-Online Galeriebild
als eigene Zeile einbauen
Erklärung:
Mit [gbild] kann man eines der bereits vorhandenen Bilder aus der Galerie von YogalehrerOnline für die Webseite übernehmen. Die Bilder sind im Balken „Yogalehrer-Online Galerie
Bilder“ enthalten und können dort angesehen werden. Man muss sich die Nummer des
gewünschten Bildes merken.
Seite 14 von 38
BBCode
Beispiel:
HTML-Entsprechung
Ergebnis
Aussehen:
[gbild 19]
[google-translator]
<div id=“googletranslator“...
Google-Übersetzer auf der
eigenen Webseiteneditor
Erklärung:
Der Befehl erzeugt eine Klappliste mit wählbarer Sprache. Es wird der Google-Übersetzungsdienst
verwendet, um die Webseite in eine beliebige Sprache zu übersetzen. Da eine eigene DIV mit
eindeutigem Namen „google-translator“ verwendet wird, kann man per Benutzer-CSS diese
Klappliste in einer beliebigen Ecke der Webseite „festschrauben“.
Seite 15 von 38
BBCode
HTML-Entsprechung
Ergebnis
[goname (Zielname)
(Beschriftung)]
<a
Seiteninternes Linkziel
href=“#(Bezeichnung)“ anspringen
>
Erklärung:
[goname] erzeugt einen seiteninternen Link auf einen anderen Teil der selben Webseite. Man
benötigt auch noch den Befehl „[name]“ im Zielbereich, um das Ziel zu definieren. Der Zielname
darf keine Umlaute und keine Leerzeichen enthalten. Am einfachsten ist es, wenn man nur Ziffern
und Buchstaben verwendet. Alles nach dem Zielnamen ist Beschriftung. Dadurch kann man den
seiteninternen Link in den fließenden Text der Seite einbauen.
Beispiel:
Beachten Sie auch unsere [goname neuheiten neuen Angebote] für den
Sommer.
Aussehen:
Beachten Sie auch unsere neuen Angebote für den Sommer.
Wirkung:
Beim Klick auf den Link „neuen Angebote“ wird der Teil der Webseite mit den neuen Angeboten
ins Blickfeld gescrollt. Damit das Beispiel funktioniert, muss an der Stelle mit den neuen
Angeboten auf der selben Seite der Befehl [name neuheiten] stehen.
Siehe auch: [name]
[h1] … text … [/h1]
[h1 … text … ]
<h1>
Überschrift 1
Erklärung:
[h1] ist die größte Überschrift. [h2] und [h3] fallen jeweils etwas kleiner aus. Jede Seite sollte
mit einer großen Überschrift beginnen. Der danach folgende Text darf dann auch mit kleineren
Überschriften gegliedert sein.
Überschriften werden von Suchmaschinen bevorzugt untersucht: Ist da etwa ein Keywort drin?
Je nach gewähltem Design kann eine Überschrift auch mit grafischer Schriftart ersetzt werden.
Beispiele:
Aussehen:
Seite 16 von 38
BBCode
HTML-Entsprechung
[h1]Das ist eine große Überschrift[/1]
[h1 Das ist eine große Überschrift]
[h2] … text … [/h2]
[h2 … text … ]
Ergebnis
Das ist eine große Überschrift
<h2>
Überschrift 2
<h3>
Überschrift 3
<hr>
Horizontale Trennlinie
Erklärung:
[h2] ist etwas kleiner als [h1].
Siehe auch [h1]
[h3] … text … [/h3]
[h3 … text … ]
Erklärung:
[h3] ist etwas kleiner als [h2].
Siehe auch [h1] oder [h2]
[hr]
Erklärung:
[hr] bedeutet „horizontal ruler“ und macht ein „horizontales Lineal“. Gemeint ist die horizontale
Trennlinie. Das Aussehen der Trennlinie kann im CSS-Modul geändert werden.
Beispiel:
[hr]
Aussehen:
(Beachte den Strich über diesem Satz)
[html] … html-Code …
[/html]
„Echtes“ HTML eingeben.
Erklärung:
[html] erlaubt es, „richtigen“ Quelltext in die Seite einzubauen. So gibt es Webseiten, die
sogenannte „Badges“ oder andere „Widgets“ zur Verfügung stellen. Üblicherweise handelt es sich
Seite 17 von 38
BBCode
HTML-Entsprechung
Ergebnis
um ein Stückchen Javascript-Code, der etwas von einer anderen Webseite lädt und auf der eigenen
Webseite anzeigt.
Bei der Eingabe ist zu beachten, dass einfache Anführungszeichen ' innerhalb des HTMLBereiches dazu führen, dass die Seite nicht gespeichert wird.
[i] … text … [/i]
[i … text … ]
<i>
Kursiver Text
Beispiele:
Normal: Mitten im Satz soll [i]kursiver Text[/i] stehen.
Faulenzer: Mitten im Satz soll [i kursiver Text] stehen.
Aussehen:
Mitten im Satz soll kursiver Text stehen.
[icq <icq-nummer>]
<a
ICQ-Link zum ICQ-Partner mit
href=“http://www.icq. der entsprechenden Nummer
com...“>
Erklärung:
Der Befehl [icq <nummer>] macht einen klickbaren Link, mit welchem die ICQ-Seite des
Inhabers von <nummer> angefahren wird. Es wird versucht, den Online-Status auszugeben.
[k] … text … [/k]
[k … text … ]
<i>
Kursiver Text
Beispiele:
Normal: Mitten im Satz soll [k]kursiver Text[/k] stehen.
Faulenzer: Mitten im Satz soll [k kursiver Text] stehen.
Aussehen:
Mitten im Satz soll kursiver Text stehen.
[kontakt]
Interaktives Kontaktformular
Erklärung
[kontakt] fügt ein Kontaktformular in die Seite ein. Das Aussehen und Verhalten des
Seite 18 von 38
BBCode
HTML-Entsprechung
Ergebnis
Kontaktformulars kann man im Arbeitsbereich > Homepage > Kontaktformular festlegen. Die
aktuelle Anleitung befindet sich im „Waschzettel“ am Seitenende des Moduls.
Beispiel:
[kontakt] Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Vestibulum leo mi, vestibulum eget pretium eu, hendrerit vel orci.
Donec at augue arcu, id tempus metus. Nunc facilisis consectetur
leo; at malesuada tortor elementum nec.
Aussehen:
[kurse]
Modul
Kursliste ausgeben
Erlklärung:
[kurse] gibt alle aktuellen Kurse in der selben Art aus, wie die Kursliste in der offenen Yogaliste
angezeigt wird. Das Aussehen kann sich je nach gewähltem Design leicht ändern.
Damit man die Veranstaltungsorte über die Links anspringen kann, muss noch [orte] am
Seitenende aufgerufen werden, um die Liste der Trainingsorte auszugeben und damit der Link zum
Trainingsort in der Kurstabelle sein Ziel auf der selben Seite findet.
Beispiel:
[h2 Die aktuellen Kurse]
[kurse]
[h2 Veranstaltungsort]
[orte]
Aussehen:
Seite 19 von 38
BBCode
HTML-Entsprechung
Ergebnis
Siehe auch: [orte], [stundenplan]
[lbild (Bildnummer)]
<img>
Bild nach links schweben
lassen, Text ist rechts davon.
Siehe auch: [bild], [stop]
Erklärung:
[lbild] fügt ein bereits hochgeladenes Bild in die Seite ein. Das Bild schwebt nach links, der
Rest der Seite ordnet sich rechts davon an. Man kann diesen Befehl dazu verwenden, um ein Bild
mit Text zu erklären oder einfach, um den laufenden Text mit einem Bild aufzulockern.
[lbild] und [rbild] sollten am Zeilenanfang stehen.
Beispiel:
[lbild 1]Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Proin vulputate cursus enim sed blandit. Aliquam porttitor eros
metus. Proin eget ante vitae neque egestas posuere id a enim.
Donec elementum lobortis magna; quis mollis nisl lobortis eget.
Proin non sapien enim.
Aussehen:
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin
vulputate cursus enim sed blandit. Aliquam porttitor eros metus.
Proin eget ante vitae neque egestas posuere id a enim. Donec
elementum lobortis magna; quis mollis nisl lobortis eget. Proin
non sapien enim.
[left] … text …
[/left]
<div style=“textalign:left“>
Text linksbündig
Seite 20 von 38
BBCode
HTML-Entsprechung
Ergebnis
Erklärung:
[left] macht einen linksbündigen Absatz. (Das ist eigentlich das „normale“ Absatzformat.)
Beispiel:
[left]Lorem ipsum dolor sit amet, consectetur adipiscing elit. In
orci, vel vulputate justo.[/left]
Aussehen:
Siehe auch: [right], [center] und [block]
[lgbild (Bildnummer)] <img>
nach links schweben lassen,
Text ist rechts davon.
Erklärung:
[lgbild] fügt ein Bild aus der Galerie von YO in die Seite ein. Das Bild schwebt nach links, der
Rest der Seite ordnet sich rechts davon an. Man kann diesen Befehl dazu verwenden, um den
laufenden Text mit einem Bild aufzulockern.
[lgbild] und [rgbild] sollten am Zeilenanfang stehen.
Beispiel:
[lgbild 19]Lorem ipsum dolor sit amet, consectetur adipiscing
elit. Proin vulputate cursus enim sed blandit. Aliquam porttitor
eros metus. Proin eget ante vitae neque egestas posuere id a enim.
Aussehen:
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin vulputate
cursus enim sed blandit. Aliquam porttitor eros metus. Proin eget ante
vitae neque egestas posuere id a enim. Donec elementum lobortis
magna; quis mollis nisl lobortis eget. Proin non sapien enim.
Seite 21 von 38
BBCode
HTML-Entsprechung
Ergebnis
<li>
Listenelement für [ol] und [ul]
Siehe auch: [gbild], [stop]
[li]
Erklärung:
[li] fügt ein Listenelement in eine [ol] oder [ul] – Liste ein.
Beispiel:
[ol][li]erstes Element [li] zweites [li] das Letzte [/ol]
Aussehen:
1. erstes Element
2. zweites
3. das Letzte
[lkontakt]
Kontaktformular links
schwebend.
Erklärung
[lkontakt] fügt ein nach links schwebendes Kontaktformular in die Seite ein. Nachfolgender
Text wird rechts daneben angeordnet. Das Aussehen und Verhalten des Kontaktformulars kann man
im Arbeitsbereich > Homepage > Kontaktformular festlegen. Die aktuelle Anleitung befindet sich
im „Waschzettel“ am Seitenende des Moduls.
Beispiel:
[lkontakt] Lorem ipsum dolor sit amet, consectetur adipiscing
elit. Vestibulum leo mi, vestibulum eget pretium eu, hendrerit vel
orci. Donec at augue arcu, id tempus metus. Nunc facilisis
consectetur leo; at malesuada tortor elementum nec.
Aussehen:
Seite 22 von 38
BBCode
HTML-Entsprechung
Ergebnis
Siehe auch: [stop]
[lmap]
Google-Map links schwebend
einbauen
Erklärung:
[lmap] bringt die selbe Google-Map, wie sie in der offenen Yogaliste ist, in die Webseite und läßt
sie nach links schweben. Folgender Text wird rechts davon angeordnet. Leider klappt die GoogleMap nur in etwa 95% der Fälle, die geografischen Daten der Firma Tele Atlas haben noch viele
Löcher und sind nicht 100% zuverlässig.
Beispiel:
[lmap] Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Aussehen:
Die Map schwebt nach links, der folgende Text
wird rechts daneben angeordnet. [lmap] verhält
sich wie [lbild].
Es ist sinnvoll, am Ende des Textes den Befehl
[stop] einzugeben, um wieder einen sauberen
Neuanfang zu haben.
[lrollbox]
Animierten Bereich links
schwebend einfügen.
Erklärung:
Seite 23 von 38
BBCode
HTML-Entsprechung
Ergebnis
[lrollbox] baut einen animierten Bereich in die Webseite ein und läßt ihn nach links
schweben. Nachfolgender Text ordnet sich rechts daneben an. Die Rollbox muss zuvor im
Arbeitsbereich > Homepage > Rollbox definiert werden. Die aktuelle Anleitung zur Rollbox
findest du im „Waschzettel“ am Seitenende des Moduls „Rollbox“.
Beispiel:
[lrollbox]
Aussehen: Vergleichbar mit [lbild].
Siehe auch: [stop]
[map]
Google-Map einbauen
Erklärung:
[map] bringt die selbe Google-Map, wie sie in der offenen Yogaliste ist, in die Webseite. Leider
klappt die Google-Map nur in etwa 95% der Fälle, die geografischen Daten der Firma Tele Atlas
haben noch viele Löcher und sind nicht 100% zuverlässig.
Beispiel:
[lmap] Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Aussehen:
Die Google-Map wird wie der [bild]-Befehl in
den Text eingefügt und steht für sich alleine.
[name (bezeichnung)]
<a name=“(bezeichnung)“>
Ziel für seiteninternes Verlinken
Seite 24 von 38
BBCode
HTML-Entsprechung
Ergebnis
festlegen.
Erklärung:
[name] legt das Ziel für einen [goname] – Link fest. Es wird keine grafische Ausgabe erzeugt.
Dieser Befehl hat keine Ausgabe, man sieht ihn auf der Webseite nicht mehr. Deshalb kann man
[name] mitten im Seiten-Text dort ausbringen, wo für „goname“ interessante Ziele erwähnt
werden.
Beispiel:
[name neuheiten][h3 Die neuen Sommerkurse: Sonne, Sand und Yoga]
Aussehen:
Die neuen Sommerkurse: Sonne, Sand und Yoga
(Man sieht es nicht!)
Siehe auch: [goname]
[ol] … liste … [/ol]
<ol> …
Nummerierte Liste
Erklärung:
„OL“ bedeutet: „Ordered List“. Eine nummerierte Liste erzeugen. Innerhalb des [ol] … [/ol]
Konstrukts dürfen nur mit [li] angekündigte Elemente auftauchen.
Beispiel:
[ol][li]erstes Element [li] zweites [li] das Letzte [/ol]
Aussehen:
4. erstes Element
5. zweites
6. das Letzte
[orte]
Alle Trainingsorte auflisten.
Erklärung:
[orte] wird gebraucht, um für [kurse], [termine] und [stundenplan] das Ziel für
den Link zum Trainingsort bereit zu stellen. Immer, wenn [kurse], [termine] oder
Seite 25 von 38
BBCode
HTML-Entsprechung
Ergebnis
[stundenplan] auf einer Seite benutzt wird, muss auf der selben Seite irgendwo der Befehl
[orte] stehen.
Beispiel:
[orte]
Aussehen:
[q] … text … [/q]
[q … text … ]
<blockquote>
Eingerückter Text
Erklärung:
[q] (Quote) ist an sich schon ein Faulenzer für den HTML-Befehl „blockquote“. Dieser wird
wenig genutzt, wohl weil seine HTML-Bezeichnung „blockquote“ zu lang geraten ist, für das
Wenige, das er tut. [q] ist verwandt mit [ol] und [ul], die beide ebenfalls einrücken.
Beispiel:
Normaler Text [q eingerückter Text] und nochmal normaler Text.
Aussehen:
Normaler Text
eingerückter Text
und nochmal normaler Text.
[rbild (Bildnummer)]
<img>
Bild nach rechts schweben
lassen, Text ist links davon.
Siehe auch: [stop]
Erklärung:
[rbild] fügt ein bereits hochgeladenes Bild in die Seite ein. Das Bild schwebt nach rechts, der
Seite 26 von 38
BBCode
HTML-Entsprechung
Ergebnis
Rest der Seite ordnet sich links davon an. Man kann diesen Befehl dazu verwenden, um ein Bild
mit Text zu erklären oder einfach, um den laufenden Text mit einem Bild aufzulockern.
[rbild] und [lbild] sollten am Zeilenanfang stehen.
Beispiel:
[rbild 1]Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Proin vulputate cursus enim sed blandit. Aliquam porttitor eros
metus. Proin eget ante vitae neque egestas posuere id a enim.
Aussehen:
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin
vulputate cursus enim sed blandit. Aliquam porttitor eros metus.
Proin eget ante vitae neque egestas posuere id a enim. Donec
elementum lobortis magna; quis mollis nisl lobortis eget. Proin
non sapien enim.
[rgbild (Bildnummer)] <img>
nach rechts schweben lassen,
Text ist links davon.
Siehe auch: [stop]
Erklärung:
[rgbild] fügt ein Bild aus der Galerie von YO in die Seite ein. Das Bild schwebt nach rechts,
der Rest der Seite ordnet sich links davon an. Man kann diesen Befehl dazu verwenden, um den
laufenden Text mit einem Bild aufzulockern.
[rgbild] und [lgbild] sollten am Zeilenanfang stehen.
Beispiel:
[rgbild 19]Lorem ipsum dolor sit amet, consectetur adipiscing
elit. Proin vulputate cursus enim sed blandit. Aliquam porttitor
eros metus. Proin eget ante vitae neque egestas posuere id a enim.
Seite 27 von 38
BBCode
HTML-Entsprechung
Ergebnis
Aussehen:
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin vulputate
cursus enim sed blandit. Aliquam porttitor eros metus. Proin eget ante
vitae neque egestas posuere id a enim. Donec elementum lobortis
magna; quis mollis nisl lobortis eget. Proin non sapien enim.
[right] … text …
[/right]
<div style=“textalign:right“>
Text rechtsbündig
Erklärung:
[right] macht den markierten Absatz rechtsbündig.
Beispiel:
[right]Lorem ipsum dolor sit amet, consectetur adipiscing elit. In
orci, vel vulputate justo.[/right]
Aussehen:
Siehe auch: [left], [center] und [block]
[rkontakt]
Kontaktformular rechts
schwebend
Erklärung
[rkontakt] fügt ein nach rechts schwebendes Kontaktformular in die Seite ein. Nachfolgender
Text wird links daneben angeordnet. Das Aussehen und Verhalten des Kontaktformulars kann man
im Arbeitsbereich > Homepage > Kontaktformular festlegen. Die aktuelle Anleitung befindet sich
im „Waschzettel“ am Seitenende des Moduls.
Seite 28 von 38
BBCode
HTML-Entsprechung
Ergebnis
Beispiel:
[rkontakt] Lorem ipsum dolor sit amet, consectetur adipiscing
elit. Vestibulum leo mi, vestibulum eget pretium eu, hendrerit vel
orci. Donec at augue arcu, id tempus metus. Nunc facilisis
consectetur leo; at malesuada tortor elementum nec.
Aussehen:
Siehe auch: [stop]
[rmap]
Google-Map rechts schwebend
einbauen
Erklärung:
[rmap] bringt die selbe Google-Map, wie sie in der offenen Yogaliste ist, in die Webseite und läßt
sie nach links schweben. Folgender Text wird rechts davon angeordnet. Leider klappt die GoogleMap nur in etwa 95% der Fälle, die geografischen Daten der Firma Tele Atlas haben noch viele
Löcher und sind nicht 100% zuverlässig.
Beispiel:
[rmap] Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Aussehen:
Die Map schwebt nach rechts, der folgende Text
wird links daneben angeordnet. [rmap] verhält
sich wie [rbild].
Es ist sinnvoll, am Ende des Textes den Befehl
[stop] einzugeben, um wieder einen sauberen
Neuanfang zu haben.
Seite 29 von 38
BBCode
HTML-Entsprechung
[rollbox]
Ergebnis
Animierten Bereich einfügen
Erklärung:
[rollbox] baut einen animierten Bereich in die Webseite ein. Die Rollbox muss zuvor im
Beispiel:
[rollbox]
Aussehen: Vergleichbar mit [bild]
[rrollbox]
Animierten Bereich rechts
schwebend einfügen.
Erklärung:
[rrollbox] baut einen animierten Bereich in die Webseite ein und läßt ihn nach rechts
schweben. Nachfolgender Text ordnet sich links daneben an. Die Rollbox muss zuvor im
Beispiel:
[rrollbox]
Aussehen: Vergleichbar mit [rbild].
Siehe auch: [stop]
[skype <skypenr>]
<a href=“skype:...“>
Link für Skype
Erklärung:
Generiert einen für Skype ® nutzbaren Link aus der Skype-Adresse <skypenr>.
Seite 30 von 38
BBCode
HTML-Entsprechung
[small] … text …[/small] <small>
[small … text … ]
Ergebnis
Text etwas kleiner machen.
Erklärung:
[small] macht den Text etwas kleiner, als er im Moment ist.
Beispiel:
Das ist normaler Text. [small] Dieser Text wird etwas kleiner. [/small] Das ist normaler Text.
Das ist normaler Text. [small Dieser Text wird etwas kleiner.] Das ist normaler Text.
Aussehen:
Das ist normaler Text. Dieser Text wird etwas kleiner. Das ist normaler Text.
[stop]
<div
Beendet Schwebezustände von
style=“clear:both“></ Bildern und Textbereichen
div>
Erklärung:
[stop] beendet Schwebezustände von Seitenbereichen und erlaubt einen sauberen Neuanfang,
ohne dass sich schwebende Bereiche ineinander verhaken und einen „Treppeneffekt“ erzeugen.
Eine einfache Aufgabe ist es, das Bild eines Yogatrainers nach links schweben zu lassen und rechts
daneben die Vita des Trainers als Text auszugeben. Das klappt natürlich. Unter dieser BildTextkombination soll der nächste Trainer in gleicher Weise ausgegeben werden. Was passiert? Das
nächste Bild hängt irgendwo weiter links, der Vita-Text zum Bild ist noch weiter nach rechts
verschoben. Es sieht greulich aus. Wenn man genügend oft die Eingabetaste zwischen den beiden
Trainerabsätzen drückt, dann sieht es irgendwann normal aus. Bis der Text wieder geändert wird.
Mit [stop] nach jedem Trainertext kommt das nächste [lbild] sofort freiwillig ganz nach
links.
Das Problem liegt darin, dass HTML den hinter einem mit „float:left“ ins Schweben geratenen
Seiteninhalt einfach ebenfalls nach links schweben läßt. [stop] erzeugt einen neuen, leeren
Absatz, der den style „clear:both“ enthält. Clear:both bedeutet: Lösche beide
Schwebezustände (links und rechts).
[stundenplan]
Interaktiven Stundenplan
ausgeben.
Erklärung:
[stundenplan] ersetzt [kurse] und [termine] und gibt einen interaktiven Stundenplan
Seite 31 von 38
BBCode
HTML-Entsprechung
Ergebnis
aus, der die Kurse und Termine wochenweise anzeigt. Auf der selben Seite muss noch der Befehl
[orte] angegeben werden, damit der Link zum beschriebenen Ort auch funktioniert.
Beispiel:
[h2 Die aktuellen Kurse und Termine]
[stundenplan]
[orte]
Aussehen:
Das Aussehen des Stundenplans ändert sich mit dem gewählten Design.
Siehe auch: [orte], [kurse] und [termine]
[style (Argumente)] …
text … [/style]
<span style=“(Argumente)“>
Einen Teil des Textes
formatieren.
Erklärung:
[style] formatiert einen Textbereich, ohne dass ein neuer Absatz angelegt wird. Mit [style]
kann man mitten im Text die Formatierung ändern. Die Argumente sind durch Semikolon
voneinander getrennte CSS-Anweisungen.
Beispiel:
Mitten im Satz steht hier [style color:red]roter Text[/style], der
sich vom Rest abhebt.
Aussehen:
Seite 32 von 38
BBCode
HTML-Entsprechung
Ergebnis
Mitten im Satz steht hier roter Text, der sich vom Rest abhebt.
[styleclass (klasse)] <span class=“klasse“> Eine CSS-Klasse auf einen
Bereich mitten im Text wirken
lassen.
Erklärung:
[styleclass] holt beliebige, selbst definierte CSS-Klassen in die Webseiten. Im Gegensatz zu
[divclass] macht [styleclass] keinen neuen Absatz. Die im CSS-Modul definierten
Klassen gelten für alle Webseiten.
.wichtig{
color: red;
padding: 1em;
font-size: 1.2em;
text-align:center;
}
Das hier ist Text davor.
[styleclass wichtig] Das hier
ist sehr wichtig![/styleclass]
Das hier ist Text danach.
Aussehen:
Siehe auch [divclass]
Anmerkung: Die im Beispiel definierte Klasse „wichtig“ kann sowohl für [divclass] als auch
für [styleclass] verwendet werden. Man muss die Klasse nicht zweimal definieren.
[table] … tr … td …
[/table]
<table>
Tabelle
Erklärung:
[table](=Tabelle) ist ein HTML-Befehl, mit dem man eine Tabelle erzeugen kann. Jeder Inhalt
in [table] muss in einer [tr] (table row = Tabellenzeile) stehen. Jeder Inhalt in einer [tr]
muss in einer [td] (table definition = Tabelleninhalt, Zelle) stehen.
Beispiel:
Seite 33 von 38
BBCode
HTML-Entsprechung
Ergebnis
[table][tr][td] Spalte 1[td] Spalte 2 [td] spalte 3
[tr][td] bla bla [td] mittlere Spalte [td] rechte Spalte[/table]
Aussehen:
[td]
<td>
Tabellenzelle
Erklärung:
[td] (table definition=Tabelleninhalt) ist eine Tabellenzelle und führt alle Inhalte der Tabelle an.
Alle Zellen-Inhalte müssen mit [td] „eingeläutet“ werden. Alle [td] in einer Tabelle müssen
von einem [tr] gestartet werden, sie müssen Teil einer Tabellenzeile sein.
Beispiel:
Aussehen:
[termine]
Terminliste ausgeben
Erlklärung:
[termine] gibt alle aktuellen Termine in der selben Art aus, wie die Terminliste in der offenen
Seite 34 von 38
BBCode
HTML-Entsprechung
Ergebnis
Yogaliste angezeigt wird. Das Aussehen kann sich je nach gewähltem Design leicht ändern.
Damit man die Veranstaltungsorte über die Links anspringen kann, muss noch [orte] am
Seitenende aufgerufen werden, um die Liste der Trainingsorte auszugeben und damit der Link zum
Trainingsort in der Kurstabelle sein Ziel auf der selben Seite findet.
Beispiel:
Aussehen:
[h2 Die aktuellen Termine]
[termine]
[orte]
Siehe auch: [kurse], [stundenplan]
[tr]
<tr>
Tabellenzeile
Erklärung:
[tr] (table row=Tabellenzeile) kündigt eine Tabellenzeile an. [tr] muss innerhalb eines
[table] … [/table] Konstrukts auftauchen. Die einzelnen Zellen werden mit [td]
angekündigt. [tr] enthält meistens mehrere [td] – Zellen.
Beispiel:
Aussehen:
Seite 35 von 38
BBCode
HTML-Entsprechung
Ergebnis
[u] … text … [/u]
[u … text … ]
<u>
Unterstrichener Text
Beispiele:
Normal: Mitten im Satz soll [u] unterstrichener Text[/u] stehen.
Faulenzer: Mitten im Satz soll [u unterstrichener Text] stehen.
Aussehen:
Mitten im Satz soll unterstrichener Text stehen.
Anmerkung:
Unterstrichener Text in Webseiten wird vom Seitenbesucher als Link zum Anklicken verstanden.
Deshalb sollte man auf das Unterstreichen verzichten und den Text auf andere Art und Weise
hervorheben.
[url (link)
(bezeichnung)]
<a
Anklickbarer Link.
href=“(link)“>(bezeic (bezeichnung) = sichtbar, (link)
hnung)</a>
wird ausgeführt.
Erklärung:
[url] erzeugt einen Link auf eine andere Webseite. Wenn der Link nicht mit „http://“ beginnt,
wird das Ziel in der eigenen Domäne gesucht. Das „http://“ zu vergessen, ist der häufigste Fehler,
der beim Eingeben eines externen Links gemacht wird.
Syntax:
[url <Linkziel> <Anzuklickender Text>]
Beispiel:
Das ist ein Link zu [url http://www.google.de Google].
Aussehen:
Das ist ein Link zu Google.
Fehler:
Das ist kein Link zu [url www.google.de Google].
Seite 36 von 38
BBCode
HTML-Entsprechung
Ergebnis
<a href=“...“>
Wikipedia-Link zu
de.wikipedia.org.
(Es fehlt das „http://“)
[wiki (wikiwort)
(bezeichnung)]
Erklärung:
Manchmal ist ein Link zu einem Eintrag bei Wipipedia die leichteste Art, ein kompliziertes Thema
erklären zu lassen. Als „wikiwort“ bezeichne ich das Wiki-interne Schlagwort, mit dem man das
Thema bei Wikipedia.org findet. Mit „bezeichnung“ ist der allgemein gebräuchliche Name des
gesuchten Themas gemeint. Die Kunst ist es, das „wikiwort“ zu finden, das manchmal ganz
anders aussieht, als man denkt.
Wikiwort finden:
Ich möchte auf meiner Homepage den Begriff „CSS“ (Cascaded Style Sheets) mit Wikipedia
verlinken. Damit das klappt, muss ich erstmal die Wikipedia-Seiten besuchen und mich nach CSS
umschauen. Also ab nach de.wikipedia.org.
Oben links in der Ecke befindet sich das Suchfeld, wo ich meinen zu
erklärenden Begriff eingebe. Ich tippe „CSS“ und klicke dann dann auf
„Artikel“.
Ich bekomme eine neue Seite und stelle fest, dass „CSS“ für etwa 25
verschiedene Begriffe in den Sparten Computer, Medizin, Musik und
Sonstiges verwendet wird. Mein gesuchter Begriff ist ganz oben:
„Cascading Style Sheets“. Ich klicke drauf und bekomme die gesuchte
Seite mit den Erläuterungen und weiteren, hilfreichen Links zum Thema „CSS“.
In der Adresszeile des Browsers steht nun:
http://de.wikipedia.org/wiki/Cascading_Style_Sheets
Die Zeichenfolge hinter „wiki/“ ist das gesuchte „Wikiwort“.
Beispiel:
Hier ist die [wiki Cascading_Style_Sheets Erklärung zum Thema
CSS].
Aussehen:
Seite 37 von 38
BBCode
HTML-Entsprechung
Ergebnis
Das Aussehen ändert sich je nach gewähltem Design.
Seite 38 von 38

Yogalehrer Online Befehlsübersicht Allgemeines

Transcription

Documents pareils

Jivamukti-Yoga Special 02. Oktober 2016 / Kaifu Lodge - Yoga-now

integration - Yogaschule Helmstedt

Datenblatt : Stolichnaya elit Ultra Premium Vodka 3,0 Liter

Unterrichtsvertrag - Warum Happy Yoga?

integration - Yogaschule Helmstedt

Yoga-Grundausbildung der Deutschen Yoga Gesellschaft e.V.

lesen - Gräflicher Park

Mühlheim Mülheim - Ruhr | Barrierefrei

Industrie 4.0 ist in der Prozessindustrie angekommen