My Markdown cheat sheet#

These are the markdowns that I use. They work with my theme and extensions that I installed.

Headlines# 

# H1
## H2
### H3
#### H4
##### H5
###### H6

Formating#

Personally, I like using _ for italic, but left the * examples in case I accidentally do it and don’t know what’s going on.

_Italic_
*Italic*
**Bold**
***Bold and Italic***
_**Bold and Italic**_

Embedded images#

If the link to the image begins with a / then the image has to be in the static directory. Else the link is relative.

![ImageName](images/image.jpg)
![ImageName](/images/image.jpg)

With the image shortcode from the theme

{{< image src="/img/hello.png" alt="Hello Friend" position="center" style="border-radius: 8px;">}}
{{< image src="img/hello.png" alt="Hello Friend" position="center" style="border-radius: 8px;">}}

With the figure shortcode from the theme

{{< figure src="/img/hello.png" alt="Hello Friend" position="center" style="border-radius: 8px;" caption="Hello Friend!" captionPosition="right" captionStyle="color: red;" >}}
{{< figure src="img/hello.png" alt="Hello Friend" position="center" style="border-radius: 8px;" caption="Hello Friend!" captionPosition="right" captionStyle="color: red;" >}}

Text link# 

[Name](https://example.com/)

This will link a thumbnail image-small.jpg to a larger image

[![Name](images/image-small.jpg)](images/image.jpg)

You need the video ID from youtube

[![Name](https://img.youtube.com/vi/VIDEO_ID/0.jpg)](https://www.youtube.com/watch?v=VIDEO_ID)

Thumnbail image names:

  • 0.jpg
  • 1.jpg
  • 2.jpg
  • 3.jpg
  • default.jpg
  • hqdefault.jpg
  • mqdefault.jpg
  • sddefault.jpg
  • maxresdefault.jpg

Code blocks#

Just a string# 

`Code`

Multi line code# 

```
Code
Code
Code
```

Code block for specific language#

Google “Chroma Highlighting Languages” to find out the full list of supported languages.

```html
<h1>Headline</h1>
```

Code block of a code block#

If you want to print the three ticks. Add more ticks if you need to escape more. I did 5 ticks for the code block below

````
```
Code
Code
Code
```
````

Really fancy code block#

Google “Chroma Highlighting Languages” to find out the full list of supported languages. The id has to incremented for each code block.

{{< code language="html" title="Title" id="1" expand="Show" collapse="Hide" isCollapsed="true" >}}
Code
Code
Code
{{< /code >}}