Cheat Sheet für markitUp! textile (REDAXO AddOn)
Hier findest Du die snippets für die Auszeichnungssprache textile - jeweils mit Ausgabe (= Vorschau) und dem einzugebendem Code:
- Überschriften
- Texte formatieren
- Listen
- Links
- Anker
- Zitieren (in REX auch Hinweise)
- Bilder
- Tabellen
- Code
Quelle für diese Anleitung und viele weitere Tipps & Tricks: www.rexdev.de/cheatsheets/textile
| Ausgabe | Eingabe |
|---|---|
| Überschrift 1 | h1. Überschrift |
| Überschrift 1 mit spezifischer Klasse | h1(class). Überschrift |
| Überschrift 1 mit ID | h1(#id). Überschrift |
| Überschrift 1 mit Klasse und ID | h1(class#id). Überschrift |
| Überschrift 2 | h2. Überschrift |
| Überschrift 3 | h3. Überschrift |
| Überschrift 1 zentrieren | h1=. Überschrift |
Nach jeder Überschrift muss eine Leerzeile eingefügt werden!
Anker-Links auf Überschriften setzen: siehe Anker definieren
| Ausgabe | Eingabe |
|---|---|
| Das ist Dein Text | Das ist Dein Text |
| Du kannst dem Text auch eine Klasse mitgeben. | p(class). Dann steht der darauffolgende Text in einem p-Tag mit dieser Klasse. |
| Dieser Text enthält ein fettgedrucktes Wort. | Dieser Text enthält ein *fettgedrucktes* Wort. |
| Warum nicht auch mal ein Wort kursiv stellen? | Warum nicht auch mal ein Wort _kursiv_ stellen? |
| Fettgedruckt und kursiv? Na klar, auch das geht natürlich mit textile. | Fettgedruckt und kursiv? Na klar, auch *_das geht natürlich_* mit textile. |
| Auch ein formatierter span lässt sich einfügen. | Auch ein formatierter %(class)span% lässt sich einfügen. |
| Pfiffig programmiert, ist REDAXO |
Pfiffig programmiert, ist REDAXO -nicht schwer- leicht für den Redakteur zu bedienen. |
| REDAXO ist ein CMS (Akronyme einfügen). | REDAXO ist ein CMS(Content Management System) (Akronyme einfügen). |
| Bleibt noch, etwas klein zu setzen. Ideal z. B. für Quellen-Angaben oder Fußnoten. | <small>Bleibt noch, etwas klein zu setzen. Ideal z. B. für Quellen-Angaben oder Fußnoten.</small> |
| Ausgabe | Eingabe |
|---|---|
| Text linksbündig | p<. Dein Text (default). |
| Text rechtsbündig | p>. Dein Text. |
| Text zentriert | p=. Dein Text. |
| Text im justify | p<>. Dein Text. |
| Text um 1em einrücken | p(. Dein Text. |
| Text um 2em einrücken | p((. Dein Text. |
| Text um 3em einrücken | p(((. Dein Text. |
| Text ohne p-Tag | Für Text ohne p-Tag setzt Du an den Anfang der Zeile ein Leerzeichen. |
| Ausgabe | Eingabe |
|---|---|
| Texthochstellen geht auch einfach. | Text ^hochstellen^ geht auch einfach. (Achtung: vor dem hochgestellten Text muss ein Leerzeichen eingefügt werden) |
| alternative Schreibweise1 dafür | alternative Schreibweise<sup>1</sup> dafür. (Dann brauchst Du kein Leerzeichen dazwischen.) |
| weitere Schreibweise1 mit breitenlosem Leerzeichen | weitere Schreibweise^1^ mit "breitenlosem Leerzeichen (Breitenloses Leerzeichen im Thesaurus via Rotkel)":https://infothek.rotkel.de/tastaturkuerzel/schriftzeichen/leerzeichen.html |
| Den Texthochgestellt kannst Du formatieren. | Den Text ^*_hochgestellt_*^ kannst Du formatieren. |
| Willst Du Zeichen tiefstellen, so geht das natürlich auch: H2O. | Willst Du Zeichen tiefstellen, so geht das natürlich auch: H<sub>2</sub>O. |
Beachte: Nach jeder Liste eine Leerzeile einfügen.
- Bavaria ipsum dolor sit amet Breihaus anbandeln.
- Mim i sog ja nix, i red ja bloß Weiznglasl Freibia Deandlgwand etza.
- Woaß i griaß God beinand Brodzeid mogsd a Bussal aasgem Gschicht no Buam.
- Sauba ma a, ma i a Maß und no a Maß Zwedschgndadschi.
- I moan oiwei i sog ja nix, i red ja bloß i bin a woschechta Bayer, Habedehre.
* Bavaria ipsum dolor sit amet Breihaus anbandeln.
** Mim i sog ja nix, i red ja bloß Weiznglasl Freibia Deandlgwand etza.
** Woaß i griaß God beinand Brodzeid mogsd a Bussal aasgem Gschicht no Buam.
* Sauba ma a, ma i a Maß und no a Maß Zwedschgndadschi.
* I moan oiwei i sog ja nix, i red ja bloß i bin a woschechta Bayer, Habedehre.
Ebenso möglich ist ein bewusster Zeilenumbruch (Achtung: ohne Leerzeile), um beispielsweise bei längeren Aufzählungen die Lesbarkeit zu erhöhen. Alle Zeilen werden dann entsprechend automatisch eingerückt.
* Bavaria ipsum dolor
(z. B. sit amet Breihaus anbandeln.)
* Mim i sog ja nix, i red ja bloß
(z. B. Weiznglasl Freibia Deandlgwand etza.)
* Woaß i griaß God beinand Brodzeid
(z. B. mogsd a Bussal aasgem Gschicht no Buam.)
* Sauba ma a, ma i a Maß und no a Maß Zwedschgndadschi
(z. B. I moan oiwei i sog ja nix, i red ja bloß i bin a woschechta Bayer, Habedehre.)
- Bavaria ipsum dolor sit amet Breihaus anbandeln.
- Mim i sog ja nix, i red ja bloß Weiznglasl Freibia Deandlgwand etza.
- Woaß i griaß God beinand Brodzeid mogsd a Bussal aasgem Gschicht no Buam.
- Sauba ma a, ma i a Maß und no a Maß Zwedschgndadschi.
- I moan oiwei i sog ja nix, i red ja bloß i bin a woschechta Bayer, Habedehre.
# Bavaria ipsum dolor sit amet Breihaus anbandeln.
## Mim i sog ja nix, i red ja bloß Weiznglasl Freibia Deandlgwand etza.
## Woaß i griaß God beinand Brodzeid mogsd a Bussal aasgem Gschicht no Buam.
# Sauba ma a, ma i a Maß und no a Maß Zwedschgndadschi.
# I moan oiwei i sog ja nix, i red ja bloß i bin a woschechta Bayer, Habedehre.
| Ausgabe | Eingabe |
|---|---|
| Text extern verlinkt | "Text extern verlinkt":http://domain.tld |
| Text intern verlinkt | "Text intern verlinkt":redaxo://0815 (statt 0815 die ID des article) |
| Text lokal verlinkt | "Dein Text":/example |
| Link mit title-tag einfügen | "zu verlinkender Text (link title)":http://domain.tld |
| Link eine class mitgeben | "(classname) zu verlinkender text (title tooltip)":http://domain.tld |
| Link auf einen Anker | "zu verlinkender Text (title)":#anker |
| E-Mails verlinken (inklusive title) | "(classname)link text(title tooltip)":mailto:someone@example.com?subject=Wie%20es%20Dir%20gefällt |
= Zuordnen eines Namens und Links z. B. zur Überschrift Achtung: das erste Zeichen muss ein Kleinbuchstabe sein. Keine Sonderzeichen oder Leerzeichen! Groß- und Kleinschreibung ist relevant.
h1(#id). Überschrift
Hier dann Dein Text. Da die Überschrift eine Leerzeile danach braucht.
h1(class#id). Überschrift
Hier dann Dein Text. Neben der ID vergibst Du so auch noch eine Klasse.
| Ausgabe | Eingabe |
|---|---|
| Link auf einen Anker | "zu verlinkender Text (title)":#anker |
Definieren, wohin der Link springen soll: siehe Anker definieren
* "Einleitung":#einleitung
* "Hauptteil":#hauptteil
** "Thema 1":#thema1
** "Thema 2":#thema2
** "Thema 3":#thema3
* "Schluß":#schluss
"Weit hinten, hinter den Wortbergen, fern der Länder Vokalien und Konsonantien leben die Blindtexte. Abgeschieden wohnen sie in Buchstabhausen an der Küste des Semantik, eines großen Sprachozeans. Ein kleines Bächlein namens Duden fließt durch ihren Ort und versorgt sie mit den nötigen Regelialien." Blindtextgenerator Wortberge Quelle: www.blindtextgenerator.de
*"Weit hinten, hinter den Wortbergen, fern der Länder Vokalien und Konsonantien leben die Blindtexte. Abgeschieden wohnen sie in Buchstabhausen an der Küste des Semantik, eines großen Sprachozeans. Ein kleines Bächlein namens Duden fließt durch ihren Ort und versorgt sie mit den nötigen Regelialien."*
Blindtextgenerator Wortberge
<small>Quelle: "www.blindtextgenerator.de":http://www.blindtextgenerator.de</small>
Fließtext vor dem Zitat
"Überall dieselbe alte Leier. Das Layout ist fertig, der Text lässt auf sich warten. Damit das Layout nun nicht nackt im Raume steht und sich klein und leer vorkommt, springe ich ein: der Blindtext. Genau zu diesem Zwecke erschaffen, immer im Schatten meines großen Bruders »Lorem Ipsum«, freue ich mich jedes Mal, wenn Sie ein paar Zeilen lesen. Denn esse est percipi - Sein ist wahrgenommen werden. Und weil Sie nun schon die Güte haben, mich ein paar weitere Sätze lang zu begleiten, möchte ich diese Gelegenheit nutzen, Ihnen nicht nur als Lückenfüller zu dienen, sondern auf etwas hinzuweisen, das es ebenso verdient wahrgenommen zu werden: Webstandards nämlich. Sehen Sie, Webstandards sind das Regelwerk, auf dem Webseiten aufbauen. So gibt es Regeln für HTML, CSS, JavaScript oder auch XML; Worte, die Sie vielleicht schon einmal von Ihrem Entwickler gehört haben. Diese Standards sorgen dafür, dass alle Beteiligten aus einer Webseite den größten Nutzen ziehen." Quelle: www.blindtextgenerator.de
Fließtext nach dem Zitat
Fließtext vor dem Zitat
bq.. "Überall dieselbe alte Leier. Das Layout ist fertig, der Text lässt auf sich warten. Damit das Layout nun nicht nackt im Raume steht und sich klein und leer vorkommt, springe ich ein: der Blindtext. Genau zu diesem Zwecke erschaffen, immer im Schatten meines großen Bruders »Lorem Ipsum«, freue ich mich jedes Mal, wenn Sie ein paar Zeilen lesen.
Denn esse est percipi - Sein ist wahrgenommen werden. Und weil Sie nun schon die Güte haben, mich ein paar weitere Sätze lang zu begleiten, möchte ich diese Gelegenheit nutzen, Ihnen nicht nur als Lückenfüller zu dienen, sondern auf etwas hinzuweisen, das es ebenso verdient wahrgenommen zu werden: Webstandards nämlich.
Sehen Sie, Webstandards sind das Regelwerk, auf dem Webseiten aufbauen. So gibt es Regeln für HTML, CSS, JavaScript oder auch XML; Worte, die Sie vielleicht schon einmal von Ihrem Entwickler gehört haben. Diese Standards sorgen dafür, dass alle Beteiligten aus einer Webseite den größten Nutzen ziehen."
<footer>Quelle: [www.blindtextgenerator.de](http://www.blindtextgenerator.de)</footer>
p. Fließtext nach dem Zitat
Mit dem p. für den ersten Absatz nach dem Zitat signalisierst Du das Ende des bq...
| Ausgabe | Eingabe |
|---|---|
| Bild (einfach) | !imageurl! |
| Bild mit Bildbeschreibung (alt text) | !imageurl(alt text)! |
| Bild mit umschließendem Link | !imageurl!:linkurl |
| Bild mit umschließendem Link und Bildbeschreibung (alt text) | !imageurl(alt text)!:linkurl |
|=. Tabellen-Überschrift
|^.
|_. Spalte1 |_. Spalte 2 |_. Spalte 3 |_. Spalte 4 |
|-.
| Text | Text | Text | Text |
| Text (nächste Spalte leer) | | Text | Text |
Insbesondere Auswahlhilfen, die sich sortieren lassen, sind für Nutzer von höherem Nutzen.
Ein Weg (von vielen): Um eine Tabelle sortierbar zu machen, lade Dir via github das JavaScript sorttable.js von Stuart Langridge herunter.
Dann kannst Du mit der class "sortable" jede Tabelle sortierbar gestalten:
table(sortable).
|^.
| |_. Vorname |_. Nachname |
|-.
| Chef vom Dienst | Anton | Zacharias |
| Ressort Wirtschaft | Zora | Rot |
| Ressort Wissenschaften | Roberta | Humboldt |
| Ressort Mobilität | Karl-Maria | Draisler |
Willst Du Dein eigenes Script schreiben, empfiehlt sich ein Anfang mit der Vorlage von w3schools für das Sortieren von Tabellen.
Ausgabe: Eingabe
links: |<. Dein Text
rechts: |>. Dein Text
zentriert: |=. Dein Text
justify: |<>. Dein Text
Zeilen-Anfang (top): |^. Dein Text
Zeilen-Ende (bottom): |~. Dein Text
Einzelne Code-Fragmente und Zeilen umschließt Du mit zwei Klammeraffen: @code@.
Für ganze Code-Blöcke verwende bc... Beachte: Das Ende des Code-Blocks signalisierst Du textile mit einer Leerzeile sowie dem Öffnen eines neuen Tags (p / h2 / ...).
Fließtext so wie Du es zur Erläuterung Deines Code-Snippets brauchst.
bc.. <?php
echo "<h1>Open Source Code rocks!</h1>";
echo "Thank you for sharing your insights.";
?>
p. Hier geht es weiter im Text...