Copy & Paste¶

Code Schnipsel für Bilder, Tabellen, Spaltenlayout etc.

Bei Bedarf code copy Button im Code Block nutzen…

Icons & Emojis¶

Links¶

[Linktext-intern](Pfad zur Datei)

[Linktext innerhalb der Seite](#link zu einem Abschnitt auf der selben Seite)

[Linktext-externer Link](https://thermaldrones.de)

Button¶

MarkdownAnsicht - Beispiele für ButtonMarkdown - Beispiel

{ .md-button .md-button--primary }

TEAM-Bereich

[TEAM-Bereich](index.md){ .md-button .md-button--primary } 

[TEAM-Bereich](index.md){ .md-button }

Bilder¶

![Beschreibung](images/poster.webp "Titel")

width¶

{ width=250 }

height¶

{ style="height:250px" }

align left¶

{ align=left }

align right¶

{ align=right }

Hinweis: align bitte nur als Notlösung - besser hier mit CSS arbeiten! Info dazu

center¶

{ style="display: flex; justify-content: center" }

Achtung: Hier muss die style Anweisung auf eine neue Zeile…!

caption¶

![Image title](https://dummyimage.com/600x400/eee/aaa){ width=300 }
/// caption
Image caption
///

Video einbinden¶

Video im Content einbinden:

Beispiel für Youtube Video

teilen - einbetten - Optionen zum Einbetten:

Player-Steuerelemente anzeigen.

Erweiterten Datenschutzmodus aktivieren.

copy & paste

iframe Block mit <div class="video-container"> einschliessen

content.md

<div class="video-container">
<iframe width="560" height="315" src="https://www.youtube-nocookie.com/embed/videoseries?si=HdJWp2y2GtN9dDKr&amp;list=PLnsAdFrlG7q9YKwoZasuHe9-xKG8Lw7FV" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe>
</div>

Bei Youtube shorts Link abändern: shortsmit embedersetzen

Bei Vimeo gibt es bereits einen responsiven Einbettungscode -

dann ohne <div class="video-container"> und </div>!!!

Grid¶

Grid mit 2 Spalten¶

<div class="grid" markdown="1">

<div markdown="1"> <!-- Spalte 1 -->

### Linke Spalte


Inhalt **hier...**
</div>

<div markdown="1"> <!-- Spalte 2 -->

### Rechte Spalte


Inhalt **hier...**
</div>

</div>

Content Tab¶

Spalte 1Spalte 2Spalte 3Spalte 4Markdown

Inhalt der ersten Spalte.

Inhalt der zweiten Spalte.

Inhalt der dritten Spalte.

Inhalt der vierten Spalte.

=== "Spalte 1"
    Inhalt der ersten Spalte.

=== "Spalte 2"
    Inhalt der zweiten Spalte.

=== "Spalte 3"
    Inhalt der dritten Spalte.

=== "Spalte 4"
    Inhalt der vierten Spalte.

Tabellen¶

| Option | Description |
| ------ | ----------- |
| data   | path to data files to supply the data that will be passed into templates. |
| engine | engine to be used for processing templates. Handlebars is the default. |
| ext    | extension to be used for dest files. |

Inhalt rechts ausgerichtet mit | -----:|

| Option | Description |  
| ------:| -----------:|  
| data   | path to data files to supply the data that will be passed into templates. |
| engine | engine to be used for processing templates. Handlebars is the default. |
| ext    | extension to be used for dest files. |

Inhalt zentriert mit |:-----:|

| Option | Description |  
|:------:|:-----------:|  
| data   | path to data files to supply the data that will be passed into templates. |
| engine | engine to be used for processing templates. Handlebars is the default. |
| ext    | extension to be used for dest files. |