Markdown Cheat Sheet

Markdown File Logo

Headers

# H1 Header
## H2 Header
### H3 Header

Text Decoration

This is some plain text. 

*This text will be italic*  
_This will also be italic_

**This text will be bold**  
__This will also be bold__

You _**can** combine them_

You can combine them

Lists

### Unordered List
 - Do the work
 - Collect benefits

### Numbered List
 1. Pay taxes
 2. Die

### Todo List
 - [ ] Buy groceries
 - [ ] Pay bills

 ### Indented List
    - Apple
        - Granny
        - Honey Crisp
    - Banana

Tables

#### Table
| Name | Surname |
|------|---------|
| John | Pennock |

#### Table Center Align
| Name | Surname |
|:----:|:-------:|
| John | Pennock |

#### Table Left Aligned
| Name | Surname |
|:--|:--|
| John | Pennock |

#### Table Right Aligned
| Name | Surname |
|-----:|--------:|
| John | Pennock |

rendered as

Table

NameSurname
JohnPennock

Table Center Align

NameSurname
JohnPennock

Table Left Aligned

NameSurname
JohnPennock

Table Right Aligned

NameSurname
JohnPennock

Footnote Syntax


## Add the "[^1]" footnote reference in the text
## The number is manual.
Example text with specific[^1] footnote reference.

## Below the text add a spearate line
## "[^1]: footnote text goes here"
## number must match footnote reference
[^1]: Full footnote for 'specific' at document end

## The footnote is removed from document flow
## and placed at the bottom of the document
## in an ordered list, number is manual

Example text with specific1 footnote reference.

To create a quick inline link, use <url>

To create a full inline link, use [link text](url "optional title"). Add {:target="_blank"} at the end to open in a new tab2.

for example:

## URL as Text Link
<https://x.com>

## Link with Text
[link text](https://x.com/)

## Link with Text to New Tab
[link text tab](https://x.com/){:target="_blank"}

## Link with Text and Title
[link text title](https://x.com/ "x.com")

## Link with Text and Title to New Tab
[link text title tab](https://x.com/ "new tab x.com"){:target="_blank"}

Here's how these look:

URL as Text Link

https://x.com

Link with Text

link text

Link with Text to New Tab

link text tab

Link with Text and Title

link text title

Link with Text and Title to New Tab

link text title tab

Images

Markdown image syntax resembles link syntax but uses an exclamation point !

![Alt text](/path/to/img.jpg)

![Alt text](/path/to/img.jpg "Optional title")

Examples in Markdown

Alt textAlt text with optional title

Horizontal Rule <hr>

These all work

<hr>
<!-- html self closing tag  -->

___
<!-- 3 underscores  -->

***
<!-- 3 asterisks  -->

3 dashes DOES NOT WORK

---
<!-- 3 dashes does not work -->

Code

Code Inline

To create a code element inline you use a single back tick ` at the beginning and one ` the end.

OG Hello World `printf("Hello, World");`

produces =>

OG Hello World printf("Hello, World");

Code Block

To create a pre code block you use three back ticks ``` at the start and stop of the block

```
<html>
    <div>Hello!</div>
</html>
```

produces =>

<html>
    <div>Hello!</div>
</html>

Code Block Syntax

You can specify a language syntax highlighting for the code block by adding a language modifier after first back ticks, for example instead of " ``` " you write " ```js " or " ```html "

Here is how markdown written specifying html:

```html
<html>
    <div>Hello!</div>
</html>
```

is rendered with html syntax highlighting:

<html>
    <div>Hello!</div>
</html>

Language Modifiers

The Default Language modifiers for Markdown MDC (defaults) are:

```json
```javascript  or ```js
```typescript  or ```ts
```html
```css
```vue
```shell
```mdc
```markdown or ```md
```yaml

You can override this list by configuring your nuxt.config.ts file with languages found here

Note: To add to the default ones, you have to re-specify the defaults along with the new ones.

For example to add 'c', 'python', and 'terraform' to the defaults:

  content: {
    highlight: {
      langs: [ 
        'json', 'js', 'typescript', 'html', 'css', 'vue', 'shell', 'mdc', 'markdown', 'yaml',
        'c', 'python', 'terraform']
        }
    }

Showing back ticks

To show show back ticks inside of code blocks you add a fourth back tick ```` to the outer markdown and then a series of three back ticks ``` does not end the outer block.

````
```js
let x = 1 + 1
```
````

For inline code, you add an escape \ before the back tick `

Other Cheat Sheets

Footnotes

Footnotes

  1. Full footnote for 'specific' at document end ↩
  2. See stack overflow discussion on Markdown new tab syntax ↩