Schreiben

Information

Diese Seite orientiert sich inhaltlich eng an ➔ folgender Seite aus der Dokumentation des Hugo Learn Themes

Zur Erstellung der Inhalte wird Markdown verwendet. Markdown ist eine sehr leicht zu erlernende Auszeichnungssprache, die sich als offenes Reintextformat ideal zur Erstellung von Open Educational Resources eignet und in zahlreiche Zielformate überführt werden kann (neben HTML auch XML, PDF, ePUB oder Office-Formate).

Markdown wurde von John Gruber und Aaron Swartz entworfen und liegt seit 2021 in einer durch die Anwendungscommunity erstellten Spezifikation vor.

The overriding design goal for Markdown’s formatting syntax is to make it as readable as possible. The idea is that a Markdown-formatted document should be publishable as-is, as plain text, without looking like it’s been marked up with tags or formatting instructions. While Markdown’s syntax has been influenced by several existing text-to-HTML filters, the single biggest source of inspiration for Markdown’s syntax is the format of plain text email. – John Gruber

Diese Seite gibt einen Überblick über die von der Vorlage unterstützten Standardformatierungen. Jenseits der Standarformatierungen implementiert die Vorlage mehrere Markdown-Erweiterungen, deren Syntax im Kapitel Specials anhand von Beispielen erläutert wird.

Überschriften

# Ü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

Textabsätze

Lorem ipsum dolor sit amet, graecis denique ei vel, at duo primis mandamus. Et legere ocurreret pri, animal tacimates complectitur ad cum. Cu eum inermis inimicus efficiendi. Labore officiis his ex, soluta officiis concludaturque ei qui, vide sensibus vim ad.

Ausgabe:

Lorem ipsum dolor sit amet, graecis denique ei vel, at duo primis mandamus. Et legere ocurreret pri, animal tacimates complectitur ad cum. Cu eum inermis inimicus efficiendi. Labore officiis his ex, soluta officiis concludaturque ei qui, vide sensibus vim ad.

Betonung

Fett

Folgender Textteil wird fett dargestellt.

**wird fett dargestellt**

Kursiv

Folgender Textteil wird kursiv dargestellt.

*wird kursiv dargestellt*

Streichung

Folgender Textteil wird durchgestrichen dargestellt.

~~wird durchgestrichen dargestellt~~

Zitate

Zitate können mit einem > vor dem zitierten Absatz markiert werden

> To be or not to be

Ausgabe:

To be or not to be

Zitate können auch verschachtelt werden:

> To be or not to be
> > That is the question

Ausgabe:

To be or not to be

That is the question

Listen

Punktliste

Punktlisten können mit folgenden vorangestellten Zeichen erzeugt werden:

* valid bullet
- valid bullet
+ valid bullet

Beispiel:

+ Lorem ipsum dolor sit amet
+ Consectetur adipiscing elit
+ Integer molestie lorem at massa
+ Facilisis in pretium nisl aliquet
+ Nulla volutpat aliquam velit
  - Phasellus iaculis neque
  - Purus sodales ultricies
  - Vestibulum laoreet porttitor sem
  - Ac tristique libero volutpat at
+ Faucibus porta lacus fringilla vel
+ Aenean sit amet erat nunc
+ Eget porttitor lorem

Ausgabe

  • Lorem ipsum dolor sit amet
  • Consectetur adipiscing elit
  • Integer molestie lorem at massa
  • Facilisis in pretium nisl aliquet
  • Nulla volutpat aliquam velit
    • Phasellus iaculis neque
    • Purus sodales ultricies
    • Vestibulum laoreet porttitor sem
    • Ac tristique libero volutpat at
  • Faucibus porta lacus fringilla vel
  • Aenean sit amet erat nunc
  • Eget porttitor lorem

Nummerierte Liste

Eine nummerierte Liste wird durch vorangestellte Zahlen erzeugt:

1. Lorem ipsum dolor sit amet
2. Consectetur adipiscing elit
3. Integer molestie lorem at massa
4. Facilisis in pretium nisl aliquet
5. Nulla volutpat aliquam velit
6. Faucibus porta lacus fringilla vel
7. Aenean sit amet erat nunc
8. Eget porttitor lorem

Ausgabe:

  1. Lorem ipsum dolor sit amet
  2. Consectetur adipiscing elit
  3. Integer molestie lorem at massa
  4. Facilisis in pretium nisl aliquet
  5. Nulla volutpat aliquam velit
  6. Faucibus porta lacus fringilla vel
  7. Aenean sit amet erat nunc
  8. Eget porttitor lorem

Code

Inzeilige Code-Markierung

Code-Snippets im Text können mit ` markiert werden.

In diesem Beispiel wird `<section></section>` als Code dargestellt.

Ausgabe:

In diesem Beispiel wird <section></section> als Code dargestellt.

Codeblock

Um mehrzeilige Code-Blöcke zu erzeugen wird der Code zwischen ``` gestellt. Hierbei kann durch die Angabe eines Schlüsselworts für den darzustellenden Code ein Syntax Highlighting erzeugt werden.

    ```js
    grunt.initConfig({
      assemble: {
        options: {
          assets: 'docs/assets',
          data: 'src/data/*.{json,yml}',
          helpers: 'src/custom-helpers.js',
          partials: ['src/partials/**/*.{hbs,md}']
        },
        pages: {
          options: {
            layout: 'default.hbs'
          },
          files: {
            './': ['src/templates/pages/index.hbs']
          }
        }
      }
    };
    ```

Ausgabe:

grunt.initConfig({
  assemble: {
    options: {
      assets: 'docs/assets',
      data: 'src/data/*.{json,yml}',
      helpers: 'src/custom-helpers.js',
      partials: ['src/partials/**/*.{hbs,md}']
    },
    pages: {
      options: {
        layout: 'default.hbs'
      },
      files: {
        './': ['src/templates/pages/index.hbs']
      }
    }
  }
};

Tabellen

Tabellen werden durch Hinzufügen von Pipes als Trennlinien zwischen den einzelnen Zellen und durch Hinzufügen einer Reihe von Strichen (ebenfalls durch Pipes getrennt) unter der Kopfzeile erstellt.

| Kopfzeile 1 | Kopfzeile 2 |
| ----------- | ----------- |
| Zelle 1     | Zelle 2     |
| Zelle 2     | Zelle 4     |
| Zelle 5     | Zelle 6     |

Ausgabe

Kopfzeile 1 Kopfzeile 2
Zelle 1 Zelle 2
Zelle 2 Zelle 4
Zelle 5 Zelle 6

Right aligned text

Durch Hinzufügen eines Doppelpunkts auf der rechten Seite der Striche unter einer Überschrift wird der Text für diese Spalte rechts ausgerichtet.

| Kopfzeile 1  | Kopfzeile 2                            |
| -----------: | -------------------------------------: |
| Eins         | Lorem ipsum dolor                      |
| Zwei         | consetetur sadipscing elitr            |
| Drei         | sed diam nonumy eirmod tempor invidunt |

Augabe:

Kopfzeile 1 Kopfzeile 2
Eins Lorem ipsum dolor
Zwei consetetur sadipscing elitr
Drei sed diam nonumy eirmod tempor invidunt
[mainzed](https://mainzed.org)

Ausgabe:

mainzed

[mainzed](https://mainzed.org "Mainzer Zentrum für Digitalität in den Geistes und Kulturwissenschaften")

Ausgabe:

mainzed

Mit Ankern können Sprunglinks zu Überschriften auf der gleichen oder einen anderen Seite erzeugt werden.

* [Überschriften](#überschriften)
* [Tabellen](#tabellen)
* [Hyperlinks](#hyperlinks)

Ausgabe:

Trennlinie

Auf folgende Weise kann eine Trennlinie erzeugt werden

  • ___: drei Unterstriche
  • ---: drei Striche
  • ***: drei Sternchen

Ausgabe:


Bilder

Bilder haben die gleiche Syntax wie Hyperlinks mit einem vorangestellten Ausrufezeichen (und optional mit einem Alternativtext).

![Diginaut](diginaut.png "Diginauten der Digitalen Methodik")

Ausgabe:

Diginaut

Bildgrößen

Die Bildgröße kann durch die Angabe von Höhe und Breite als Paramter verändert werden

Add HTTP parameters width and/or height to the link image to resize the image. Values are CSS values (default is auto).

![Diginaut](diginaut.png?width=10pc)

Diginaut

![Diginaut](diginaut.png?height=50px)

Diginaut

Schatten und Rahmen

Durch die Angabe der Schlüsselwörter shadowund/oder border können Rahmen und Schlagschatten für eingebundene Bilder erzeugt werden.

![Diginaut](diginaut.png?width=10pc&classes=shadow)

Diginaut

![Diginaut](diginaut.png?width=10pc&classes=border)

Diginaut

![Diginaut](diginaut.png?width=10pc&classes=border,shadow)

Diginaut

Klickvergrößerung

Standardmäßig ist bei allen Bildern die Klickvergrößerung aktiviert. Diese kann über den Parameter featherlight mit dem Wert false abgeschaltet werden.

![Diginaut](diginaut.png?width=10pc&featherlight=false)

Diginaut

Hallo Team Guidelines

:-)