Markdown¶

All the basic syntax can be found on the Markdown Guide. I’ll keep on this page the syntax I forgot the most to quickly find them when I need it.

Table¶

If you want to convert a previous table into markdown, here is a handful tool.

| Syntax      | Description |
| ----------- | ----------- |
| Header      | Title       |
| Paragraph   | Text        |

Insert a video in markdown¶

<video width="400" height="200" controls autoplay>
    <source src="../../files/video.mp4" type="video/mp4">
</video>

Zoom on an image¶

![zoom image](../images/week02/notebook_web.jpg){: .zoom}

Footnote¶

Here's a sentence with a footnote. [^1]

[^1]: This is the footnote.

Here’s a sentence with a footnote. ¹

Markdown Extensions ¶

Graphs¶

I used Mermaid.js directly integrated in Mkdocs to add this diagram to my page.

mkdocs.yml

markdown_extensions:
- pymdownx.superfences:
    custom_fences:
        - name: mermaid
        class: mermaid
        format: !!python/name:pymdownx.superfences.fence_code_format

Flow chart

``` mermaid
graph LR
A[Start] --> B{Error?};
B -->|Yes| C[Hmm...];
C --> D[Debug];
D --> B;
B ---->|No| E[Yay!];
```

graph LR
A[Start] --> B{Error?};
B -->|Yes| C[Hmm...];
C --> D[Debug];
D --> B;
B ---->|No| E[Yay!];

Keyboard keys¶

++ctrl+alt+del++

Ctrl+Alt+Del

Simple¶

!!! note

    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla et euismod
    nulla.

Note

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla et euismod nulla.

Type qualifiers¶

note

Note

success, check, done

Success

question, help, faq

Question

warning, caution, attention

Warning

failure, fail, missing

Fail

danger, error

Danger

bug

Bug

Inline¶

Must be placed before the text/image/code.

Info

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla et euismod nulla. Curabitur feugiat, tortor non consequat finibus, justo purus auctor massa, nec semper lorem quam in massa.

!!! info inline

    Lorem ipsum dolor sit amet, consectetur
    adipiscing elit. Nulla et euismod nulla.
    Curabitur feugiat, tortor non consequat
    finibus, justo purus auctor massa, nec
    semper lorem quam in massa.

Inline end¶