The Yawning Abyss Markdown Cheet Sheet

Between flavours of Markdown, and Hugo specific site codes, I need a personal cheat sheet.

These are the things I need to know when writing for this site.

Basic Markdown Syntax

Headings

# Level 1 - only these will appear in post table of contents
## Level 2
#### Level 3

## Heading with a Link ID {#link-to-this-heading}
Now I can [link to it](#link-to-this-heading "with a tooltip")

 

Paragraphs

Two returns are needed to start a new paragraph.
This will appear as a single paragraph.

Line breaks can be added by ending a line with 2 spaces.<space><space>

 

Text Formatting

**bold text**
__bold text__

*italic text*
*italic text*

~~strikethrough~~

 

<http://example.com> will turn into links automatically.

[link text](https://example.com "with a tooltip")

 

Images

{{<
  figure_avif
  image="image_file.jpg"
  alt="Alternate text if the image is not displayed" 
  caption="Optional caption under the picture" 
  class="imagealigncenter" 
  width=100
>}}
  • class [optional] can be:
    • imagealignleft
    • imagealigncenter
    • imagealignright
  • width and height [optional] can be
    • A number of pixels width=100
    • A percentage - width=75%

If the width is 100% then the class aligns the caption and the image takes up the full width of the page.

The standard Markdown and Hugo shortcodes work as well.

![alt text](/img/drg_logo.jpg "Floating Tool Tip")


{{< figure 
  src="image.jpg" 
  alt="Alternate text if image is not displayed"
  title="Title as part of the caption"
  caption="A caption under the image"
  class="alignright"
  width=100%
>}}

 

Blockquotes

> Having a > before a paragraph makes the paragraph a blockquote

> To have multiple paragraphs in one blockquote.
>
> Leave a > on blank lines between the paragraphs.

 

Horizontal Rules

--- (3 dashes)
*** (3 asterix)
___ (3 underscores)

 

Unordered Lists

* bullet list items start with
  * asterisk
  * dash
  * or a plus sign

+ do not mix and match
+ which one you use

- it all comes down to your preference
- which is the easiest for you to remember and type

* [x] checklists can be created as well
* [ ] and items can be unchecked, checked, or without a checkbox
* Like this one

 

Ordered Lists

1. Add a number and a period before list items.
5. The first number should be 1 – after that it doesn’t matter.
1. The numbers used do not have to be in order or in sequence.
1. The list will be in the order it is typed.
  1. sub lists just need to be indented.

 

Code

To format a portion of a line as `code` use backticks.


    To start each line
    will create a code
    block.

```
This is all rendered as code
and not merged into paragraphs.

I typically use ~~~ instead of backticks.
```

 

Highlighted Code Block

~~~ C
#include <stdio.h>
int main() {
   // printf() displays the string inside quotation
   printf("Hello, World!");
   return 0;
}
~~~

 

Tables

| Left aligned | Center | Right  |
| :---         | :---:  | ---:   |
| item 1       | item 2 | item 3 |

Columns do not need to be aligned

| heading1 | Heading 2
| --- | ---- |
| Item1 | Item2 |
| Entry1 | Entry 2 |

 

Definitions

Thing to be define
: The definition for the thing to be defined

Something with multiple definitions
: The first definition
: The second one

 

Footnotes

You can refer to a footnote by number[^1] or by name[^longnote]

Then you can place footnotes elsewhere in the post.

[^1]: This will appear in the text where you put it. It does not need to be at the bottom of the file or page.

[^longnote]: You can have a much longer note.

    Just indent the contents after the opening paragraph.

    The note will continue until the next line that isn’t indented.

 

Emoji shortcodes

You can use emoji such as :eggplant: , :tomato: , and :clubs: . The keywords are placed between a pair of colons.

 

Audio shortcode

You can place an mp3 in a post with:

{{<
  audio
  src="filename.mp3"
  caption="title above player"
  class="imagealigncenter"
>}}

The class only applies to the caption above the audio player and not the entire audio player.