Formatierung

aus Metalab Wiki, dem offenen Zentrum für meta-disziplinäre Magier und technisch-kreative Enthusiasten.
Zur Navigation springenZur Suche springen

Formatierung & Wiki-Syntax (h1)

Hier sind einige Beispiele wie man mit markup und html sowie css tags Wikiseiten besser gestalten und formatieren kann. Mehr Beispiele sind immer erwünscht! Hier ist eine allgemeine Referenz von Mediawiki

Fett & Kursiv (h2)

Einer der häufigsten Anwendungsfälle ist Text fett zu markieren um einzelne Wörter hervorzustreichen. Das ist durch drei einfache Apostrophe möglich,''' am Anfang und ''' am Ende.

Kursiver Text kann zum Beispiel bei Zitaten verwendet werden. Dafür verwendet man zwei einfache Apostrophe '' am Anfang und '' am Ende.

Fett und Kursiv gleichzeitig geht natürlich auch! Dafür brauchst es fünf einfache Apostrophe,''''' am Anfang und ''''' am Ende. Im Editor gibt es auch F und K links oben.

Formatierungshilfen (h2)

Du willst einen
Zeilenumbruch? "<br>" macht genau das, aber du kannst auch einfach durch die enter-Taste Zeilenabstände einfügen. Achtung: du brauchst eine komplett freie Zeile damit der Inhalt in einer neuen Zeile angezeigt wird.

Du möchtest eine Linie einfügen?


Dafür kannst du vier Bindestriche verwenden, "----"

Wenn du als erstes Zeichen einen Abstand hast (Leertaste), wird der Text anders hervorgehoben.

HTML & CSS (h2)

Vieles wird durch html und css tags möglich. Achtung: Die meisten Tags müssen zugemacht werden. Achte speziell auf " und ; um Fehler zu vermeiden. Hier sind ein paar wenige Beispiele.

Um etwas zu unterstreichen kannst du einfach den html tag <u> verwenden. Du musst das Ende mit </u> kennzeichnen.

Um etwas durchzustreichen kannst du <s> verwenden. Das Ende wird mit </s> bestimmt.

Du kannst einzelne Worte in einer bestimmten Farbe anzeigen. Hier haben wir ein blaues Wort oder vielleicht ein paar rote Wörter. Dafür kannst du zum Beispiel <span style="color:red"> verwenden. Um das Ende zu bestimmen brauchst du </span>.

Überschriften (h2)

Überschriften sind hilfreich um einen Text zu strukturieren. Außerdem wird dadurch automatisch ein Inhaltsverzeichnis erstellt. Dafür verwenden wir das Ist-gleich-Zeichen "=". Es gibt verschiedene Level an Überschriften, am meisten werden h1 (ein =), h2 (zwei =) und h3 (drei =) verwendet. Die = werden sowohl am Anfang als auch am Ende der Überschrift verwendet. Auf dieser Seite sind alle Überschriften mit (h1) bis (h3) gekennzeichnet um das Muster hervorzuheben.

Tabellen (h2)

Auch hier gibt es eine gute Übersicht von Mediawiki zu Tabellen. Daher möchte ich hier nur ein paar Beispiele zeigen.

einfache Tabelle (h3)

Mimi ja
Momo vielleicht
Mana nein

Tabelle erstellen lassen (h3)

Diese Tabelle wurde mit der "Tabelle" Funktion unter "Erweitert" erstellt und dann selbst ausgefüllt. Bei Tabellen mit vielen Einträgen kannst du mit "sortable" die extra Sortierfunktion nutzen. Auch hilfreich bei Listen mit vielen Zahlen oder Daten. In diesem Fall ist es nicht sehr nützlich.

Wer kommt zum Camp?
Name Ankunft Equipment
Mimi Freitag Nachmittag Zelt + Isomatten & Schlafsack ja, kein Kochgeschirr
Momo Freitag Abend Isomatte, Schlafsack und Solarpaneele ja, kein Zelt oder Kochzeug
Mana Donnerstag Abend komplette Campingausrüsting, kann ein 2er-Zelt herborgen

Tabelle mit Formatierung (h3)

Hier noch eine einfache Liste, aber mit extra Formatierung, und dieses Mal rechtsbündig statt linksbündig.

Einkaufsliste
Klebeband extra sticky 5.98€
Kabelbinder aufmachbar 3.96€
Seitenschneider 14.98€
Schiebelehre ohne digitale Anzeige 19.99€

Listen (h2)

Hier ist wieder die detaillierte Referenz von Mediawiki zu Listen

ungeordnete Listen (h3)

Ungeordnete Listen werden mit einem Sternchen * ganz am Anfang angegeben.

  • mehr Chaos:
    • alle Flaschen können irgendwo eingeräumt werden
    • lass Dinge dort wo du sie zuletzt verwendet hast, auf gar keinen Fall an den ursprünglichen Platz zurück
    • Winkel von Tischen sollte jeden Tag leicht verändert werden
      • möglichst ineffizient!
  • es ist zu aufgeräumt

nummerierte / geordnete Listen (h3)

Geordnete Listen werden mit einem Hash # ganz am Anfang angegeben.

  1. erstelle eine aussagekräftige Wikiseite
  2. suche einen freien Termin
  3. trage die Veranstaltung im Kalender ein
  4. lass andere Leute davon wissen
    1. Ankündigung auf intern@ und metalab@ ein paar Wochen vorher
    2. ein paar Tage vorher auf Matrix, Telegram,... und vielleicht noch eine 2.Mail

Definitionslisten (h3)

Wird seltener verwendet, kann aber manchmal nützlich sein wenn du viele Begriffe erklären willst oder die Formatierung gut findest. Dafür brauchst du Semikolon ; und Doppelpunkte : ganz am Anfang.

Satzzeichen
Punkt.
Ende eines Satz
Ausrufezeichen!
Ausruf (zb: AAAAAAAH!)
Aufforderung (zb: geh!)
Wunsch (zb: Bitte hilf mir!)
Fragezeichen?
Frage (zb: Was?)
Doppelpunkt:
vor einer Aussage
direkte Rede
&many more

Links (h2)

Links sind hilfreich für vieles:

  • Quellenangabe
  • weiterführende Info
  • Shoutouts
  • Sammlungen (ähnlich wie Lesezeichen)
  • Übersichten (zB alle Räume im Metalab, oder alle Maschinen im WEL,...)

Hier ist ein Link zur Mediawiki Link-Übersicht

interne Links (h3)

Interne Links werden mit zwei eckigen Klammern angegeben. Zum Beispiel: [[Hausordnung]]

Hier ist ein interner Link: Code_of_Conduct

Hier ist ein Link zu einer Kategorie: Workshops

externe Links (h3)

Externe Links werden mit einer eckigen Klammer geöffnet und geschlossen. Um einen alternativen Text anzuzeigen kann man nach dem Link durch einen Abstand einen beliebigen Text angeben. Das Pfeil-Icon am Ende zeigt an, dass der Link wie ein externer Link formatiert ist. Ein Beispiel:[https://etherpad.wikimedia.org/p/Wiki-Workshop Link zum Etherpad für den Wikiworkshop]

Hier ist ein Link zum Etherpad für den Wikiworkshop

Bei Quellenangaben geht auch folgendes Format: What does it mean to be a woman hackerspace member? From Makezine, 5th July 2011[1]

Auch Wikilinks können als externe Links formatiert werden. Hier ist der einfache Code of Conduct als externer Link

Zitate & Über

Achtung: Wenn die Breite fix vorgegeben ist kann es sein, dass auf kleineren Bildschirmen die Formatierung über den Bildschirm raussteht. Setze width="XXX" daher bedacht ein.

„Man braucht im Leben nichts zu fürchten, man muss es nur verstehen. Jetzt es ist es an der Zeit, mehr zu verstehen, damit wir weniger fürchten.“ - Marie Curie

Syntax: {|width="600" class="wikitable" |align ="left" style="border:1px dotted lightgray; border-bottom:1px solid lightgray;padding:1em; font-size:smaller;"| ''„Man braucht im Leben nichts zu fürchten, man muss es nur verstehen. Jetzt es ist es an der Zeit, mehr zu verstehen, damit wir weniger fürchten.“'' - Marie Curie |}

Veranstaltungsmenü (h2)

Wenn du auf "Bearbeiten" oder "Quelltext anzeigen" gehst siehst du hier die Syntax für das Menü das auf vielen Seiten verwendet wird.


{| style="width: 30em; font-size: 90%; border: 1px solid #aaaaaa; background-color: #eee; color: black; margin-bottom: 0.5em; margin-left: 1em; padding: 0.2em; float: right; clear: right; text-align:left;"

| style="text-align: center; background-color:#ccccff;" colspan="2" |Formatierungsfun |- |colspan="2" align="center"| No-Logo.png |- |wann: |2024-03-10, 16:00 |- |Location: |Hauptraum |- |Involvierte: |becca |- |Rubrik: |Workshop |- |Kostenbeitrag: |0€ |- |Status: |active |- |Beschreibung: |hier kannst du dein Event beschreiben |- | Zuletzt aktualisiert: | 10.03.2024 |- |

|}


Bilder (h2)

Metafloyd Sticker Design








rahmen
rahmen


häufige Fehler (h2)

Eine der häufigsten Fehler ist einen Tag wie <s> nicht richtig zu schließen oder ein Zeichen zu vergessen. Bei Links sind zu viele Klammern ebenfalls Fehlerquellen.