If you scroll to the bottom of any page of this site, you will notice the words “Powered by Hugo”, and all posts generated in a Hugo static web app are written in markdown. Having owned a Github account for a few years now, I have some experience writing docs in markdown, but at times have to resort to looking up Markdown style guides.
Here is my quick reference for writing in Markdown.
Headers
# Header 1
## Header 2
### Header 3
Display as follows:
Header 1
Header 2
Header 3
Code/Config Snips
Add a code or config file snippets by wrapping it in three backticks (```) above and below the code block.
```go
package main
import “fmt”
func main() {
}
```
package main
import "fmt"
func main() {
}
Or you can wrap a word in single backticks: `Command` goes here
Or you can wrap a word in single backticks: Command
goes here
Escape Characters
In order to show the command above I had to add in a backslash to show the literal backtick like follows:
Or you can wrap a word in single backticks: \`Command` goes here
Bold and Italics
Bold text can be defined in two different ways. Using double underscores ( __ ) or double asterisk ( ** )
Bold __text__ can be defined in **two** different ways
Italic text can be defined in two different ways. Using single underscores '_'
or single asterisk '*'
Italic _text_ can be defined in *two* different ways
Lists
Ordered lists as follows
1. Item 1
1. Item 2
1. Item 3
- Item 1
- Item 2
- Item 3
Unordered lists
* Item 1
* Item 2
* Item 2a
* Item 2b
- Item 1
- Item 2
- Item 2a
- Item 2b
Images
![imageName](images/docker.png)
Links
Links can be written as follows:
link to [Github](https://github.com/markkerry)
Which will display as follows:
link to Github
Images with Links
[![Github](images/github.png)](https://github.com/markkerry)
Which will display as follows with a click-able image:
Tables
Structure them as follows
| Name | Age |
| ---- | --- |
| Mark | Old |
To display the following:
Name | Age |
---|---|
Mark | Old |
Tasks
Can be written like this
* [x] Task complete
* [ ] Task pending
And display as folllows
- Task complete
- Task pending
Blockquotes
> Note: Please ensure you...
>> Also note...
Note: Please ensure you…
Also note…
Line Breaks
Occasionally, you may want to space out the paragraghs or create more space between the next header. You can acheive this by adding the <br>
html tag on it’s own line between the paragraghs where you want more space.
Comments
You can add comments to your markdown document which will not be rendered to the reader.
### Comment Example
<!--
Remember to Update this part
-->
Text to be updated
Comment Example
Text to be updated