Section outline

◄Arbeiten mit den Texteditoren
►Spezial: HTML & CSS

  • Markdown ist eine vereinfachte Auszeichnungssprache, beinhaltet also - wie HTML auch - den eigentlichen Textinhalt und Gliederungsangaben gleichermaßen. Im Gegensatz zu z.B. HTML sind deutlich weniger Auszeichnungen notwendig: Während jedes HTML-Element normalerweise einen öffnenden und schließenden Tag besitzt, können Auszeichnungen mittels Markdown mit einzelnen Zeichen oder Leerzeichen-Kombinationen vorgenommen werden.

    Beispiele:

    HTML:
    <h1>Überschrift 1</h1>

    Markdown:
    #Überschrift 1

    Ausgabe:

    Überschrift 1

    HTML:
    <strong>Fettschrift</strong>

    Markdown:
    **Fettschrift**

    Ausgabe:
    Fettschrift

    Eine Markdown-Eingabe ist möglich, wenn in den persönlichen Einstellungen (Login erforderlich!) unter Texteditor wählen die Option "Einfacher Text" ausgewählt wird. Danach steht bei nächstem Aufruf einer Seite mit einem Texteditor unter dem Eingabefeld ein Drop-Down-Menü zur Verfügung, in dem man die Option "Markdown-Format" auswählen kann:

    Screenshot vom Eingabefeld mit Drop-Down-Menü und ausgewählter Option "Markdown"

    Die einzelnen Formatierungsmöglichkeiten finden Sie hier:
    • Inhalt
      01. Überschriften

      Überschriften können in sechs Hierarchie-Stufen (entsprechend der HTML-Elemente <h1> bis <h6>) mit vorangestellten Rauten # erzeugt werden:

      Eingabe
      # Überschrift 1
      ## Überschrift 2
      ### Überschrift 3
      #### Überschrift 4
      ##### Überschrift 5
      ###### Überschrift 6
      Ausgabe

      Überschrift 1

      Überschrift 2

      Überschrift 3

      Überschrift 4

      Überschrift 5
      Überschrift 6
       
      02. Text, Umbrüche, Absätze

      Text kann einfach eingegeben werden und wird als "normaler Text" gerendert. Dabei werden Zeilenumbrüche ignoriert:

      Eingabe
      Dies ist ein Text.
      Der Umbruch wird ignoriert.
      Ausgabe
      Dies ist ein Text. Der Umbruch wird ignoriert.
       
      Um einen Umbruch zu generieren, müssen am Zeilenende mind. zwei Leerzeichen platziert werden:
      Eingabe
      Dies ist ein Text.  
      Der Umbruch wird durch     
      zwei Leerzeichen erzeugt.
      Ausgabe
      Dies ist ein Text.
      Der Umbruch wird durch
      zwei Leerzeichen erzeugt.


      Absätze werden mit einer leeren Zeile erzeugt:

      Eingabe
      Dies ist ein Text.

      Hier beginnt ein neuer Absatz.
      Ausgabe

      Dies ist ein Text.

      Hier beginnt ein neuer Absatz.

      03. Formatierungen

      Inline-Formatierungen wie kursiv, fett und fett kursiv können mit unterschiedlich vielen * erzeugt werden. Für Inline-Code sind Hochkommata erforderlich:

      Eingabe
      Das hier ist *kursiv*.

      So geht **fette** Schrift.

      Drei Asteriske formatieren ***fett kursiv***.

      Für Inline-Code werden `Hochkommata` genutzt.
      Ausgabe

      Das hier ist kursiv.

      So geht fette Schrift.

      Drei Asteriske formatieren fett kursiv.

      Für Inline-Code werden Hochkommata genutzt.

      04. Listen

      Markdown unterstützt unordered lists (HTML: <ul>), also Listen mit Spiegelstrichen oder Punkten, die mit *  generiert werden.
      Achtung: Nach dem Asterisk ist ein Leerzeichen erforderlich.

      Die Listen lassen sich verschachteln. Jede weitere Hierarchiestufe wird mit einem weiteren Leerzeichen eingerückt.

      Eingabe
      * Listenpunkt 1
      * Listenpunkt 2
       * Listenpunkt 2.1
       * Listenpunkt 2.2
        * Listenpunkt 2.2.1
        * Listenpunkt 2.2.2
       * Listenpunkt 2.3
      * Listenpunkt 3
      Ausgabe
      • Listenpunkt 1
      • Listenpunkt 2
        • Listenpunkt 2.1
        • Listenpunkt 2.2
          • Listenpunkt 2.2.1
          • Listenpunkt 2.2.2
        • Listenpunkt 2.3
      • Listenpunkt 3

      Außerdem werden nummerierte Listen (ordered lists, <ol>) mit einer beliebigen Zahl incl. Punkt und Leerzeichen (3. ) generiert. Eingebürgert hat sich eine Nummerierung aller Listeneinträge mit 1. , 1. , 1. , ... da die "echte" Nummerierung beim Rendern vorgenommen wird, es können aber beliebige Zahlen geschrieben werden.

      Eingabe
      1. Listenpunkt 1
      1. Listenpunkt 2
       1. Listenpunkt 2.1
       1. Listenpunkt 2.2
        1. Listenpunkt 2.2.1
        1. Listenpunkt 2.2.2
       1. Listenpunkt 2.3
      1. Listenpunkt 3
      Ausgabe
      1. Listenpunkt 1
      2. Listenpunkt 2
        1. Listenpunkt 2.1
        2. Listenpunkt 2.2
          1. Listenpunkt 2.2.1
          2. Listenpunkt 2.2.2
        3. Listenpunkt 2.3
      3. Listenpunkt 3

      Eine Mischung von Nummerierung und Spiegelstichen ist ebenfalls möglich:

      Eingabe
      1. Listenpunkt 1
      1. Listenpunkt 2
       * Listenpunkt 2.1
       * Listenpunkt 2.2
        1. Listenpunkt 2.2.1
        1. Listenpunkt 2.2.2
       * Listenpunkt 2.3
      1. Listenpunkt 3
      Ausgabe
      1. Listenpunkt 1
      2. Listenpunkt 2
        • Listenpunkt 2.1
        • Listenpunkt 2.2
          1. Listenpunkt 2.2.1
          2. Listenpunkt 2.2.2
        • Listenpunkt 2.3
      3. Listenpunkt 3

      Außerdem können in Markdown sog. definition lists (HTML: <dl>) erstellt werden, die jeweils einen Term (<dt>) und eine Definition (<dd>) gruppieren.

      Eingabe
      Moodle
      :   Lernplattform
      HISinOne
      :   Campusmanagement
      Sciebo
      :   Cloudspeicher
      Ausgabe
      Moodle
      Lernplattform
      HISinOne
      Campusmanagement
      Sciebo
      Cloudspeicher
       
      06. Blockzitate

      Blockzitate - also das HTML-Element <blockquote> - erzeugt man mit einer spitzen Klammer am Beginn der ersten Zeile: >.

      Eingabe
      > Der Gedanke, einmal in seiner Größe gefaßt, kann nicht mehr verschwinden; solange es Menschen gibt,
      wird auch der starke Wunsch da sein, den Turm zu Ende zu bauen. (Franz Kafka)
      Ausgabe
      Der Gedanke, einmal in seiner Größe gefaßt, kann nicht mehr verschwinden; solange es Menschen gibt, wird auch der starke Wunsch da sein, den Turm zu Ende zu bauen. (Franz Kafka)
       
      07. Horizontale Linien

      Horizontale Linien, das Element <hr> - erzeugt man mit drei Asterisken in einer Zeile ***:

      Eingabe
      Text oberhalb der Linie
      ***
      Text unterhalb der Linie
      Ausgabe

      Text oberhalb der Linie

      Text unterhalb der Linie

      08. Vorformatierung

      (Code-) Blöcke - also das HTML-Element <pre> - erzeugt man mit vier Leerzeichen am Beginn einer Zeile.

      Eingabe
          Hier der Code ...
          ... in zwei Zeilen
      Ausgabe
      Hier der Code ...
      ... in zwei Zeilen
       
      09. Hyperlinks


      Für Hyperlinks - in HTML das <a>-Element - muss der Linktext (in runden Klammern) und das Linkziel [in eckigen Klammern] angegeben werden:

      Eingabe
      Hier ist ein (Link)[https://moodle.thga.de] zur Lernplattform.
      Ausgabe

      Hier ist ein Link zur Lernplattform.

       
      10. Tabellen


      Für Tabellen werden lediglich senkrechte | und waagerechte Striche - benötigt. Die senkrechten Striche kann man normalerweise mit [Alt Gr] + [<] erzeugen.

      Eingabe
      Spalten-|Überschriften
      ---|---
      Zellen,|Zellen,
      Noch mehr|Zellen
      Ausgabe
      Spalten- Überschriften
      Zellen, Zellen,
      noch mehr Zellen
       
      11. Maskierung von Funktionszeichen

      Wenn Sie einmal Zeichen verwenden möchten, die in Markdown eigentlich als Funktionszeichen belegt sind, z.B. das * oder das | , müssen diese maskiert werden. Das geht in Markdown mit einem "Backslash" \, der normalerweise mit [Alt Gr] + [ß] eingegeben werden kann. Der wird natürlich nicht ausgegeben, ist aber notwendig, um "dem Funktionszeichen seine Funktion zu nehmen":

      Eingabe
      * Listenpunkt
      \* maskiertes Funktionszeichen
      Ausgabe
      • Listenpunkt
      * maskiertes Funktionszeichen

      Eingabe
      | Tabelle |  |
      |---|---|
      | Zelle | Zelle |
      \| Zelle | Zelle |
      Ausgabe
      Tabelle  
      Zelle Zelle

      | Zelle | Zelle |

    • Markdown Cheat Sheet File
◄Arbeiten mit den Texteditoren
►Spezial: HTML & CSS