Markdown tutorial

Markdown is now my go-to format. It’s not as expressive as HTML, say, but it’s quick to type and very straightforward to generated programatically (you don’t have to match tags).

So let’s start with some structure.

Headings

Declare a heading by prefixing up to five hashes. The hashes are equivalent to HTML <h1> heading tags, I like to use the single hash only once at the top.

# h1
## h2
### h3
#### h4
##### h5

Next you’ll want to link to another page. Let’s credit Pascal Hertleif for this awesome gist by which the CSS for this site is based on.

It takes a while to remember which comes first: the square or the round brackets. In fact, you will never remember.

[Pascal Hertleif](https://gist.github.com/killercup)

Linking to images

You link to images in the same way but prefix a pling, note you can leave the leading brackets empty.

![](https://ping.germs.dev/hosts.svg)

If you want to also link to that image it starts to look a little unweildy! But basically you’re adding an image to the first set of brackets.

[![](https://ping.germs.dev/hosts.svg)](https://ping.germs.dev/hosts.svg)

Preformatted text

Often used as “don’t format this text!” and comes in span or block style. Use single or triple backticks around your code and you can specify the language too.

Using:

```cpp
int main() {
    // cya
    return 0;
}

Using:

```python
int main() {
    // cya
    return 0;
}

Or a single pair of back ticks around a word like mkdir.

Mermaid

See mermaid.live, only works in GitLab but I’ve included it as I use it all the time and it’s still valid markdown even if your viewer doesn’t support it..

graph TD
    A[Christmas] -->|Get money| B(Go shopping)
    B --> C{Let me think}
    C -->|One| D[Laptop]
    C -->|Two| E[iPhone]
    C -->|Three| F[fa:fa-car Car]

You can insert an m-dash using two hyphens – like this: -- – which is neater than using HTML entities.

Similary for ellipses, you just type three periods and it inserts the proper character… which is nice.

Paragraph breaks

A blank line makes a paragraph. If you really want a new line but don’t want to use bullets you can add a double space at the end of the line. But this is difficult to see/manage.

Bullet points

A leading hyphen makes a bullet point.

- once
- twice
- thrice

Or use a number for an enumerated list. Note you don’t have to increment the numbers yourself.

1. once
1. twice
1. thrice
  1. one
  2. two
  3. three

Tables

| Beats per second | Beats per hour |
|---|---|
| 3 | 10800 |
| 4 | 14400 |
| 5 | 18000 |
| 6 | 21600 |
| 7 | 25200 |
| 8 | 28800 |

Makes a nice table like this.

Beats per second Beats per hour
3 10800
4 14400
5 18000
6 21600
7 25200
8 28800

Horizontals rule

Three hyphens make a rule, akin to <hr>.

---

References

🕑 Last updated

Tue Jan 10 11:11:43 UTC 2023