Skip to content

Code & Quotes

Code

Blocks

Use Code Blocks to include lines of code in a document. The markdown extension Pygments supports syntax higlighting for many languages.

To create a Code Block, start and end a new line with three backticks (```), followed by a type and title. Between the start and end create the content of the block.

```python title=""
def bubble_sort(items):
    for i in range(len(items)):
        for j in range(len(items) - 1 - i):
            if items[j] > items[j + 1]:
                items[j], items[j + 1] = items[j + 1], items[j]
```
def bubble_sort(items):
    for i in range(len(items)):
        for j in range(len(items) - 1 - i):
            if items[j] > items[j + 1]:
                items[j], items[j + 1] = items[j + 1], items[j]

Lines can be numbered (linenums) and highlighted (hl_lines) to improve readabillity.

Code Block with title, line numbers and highlighted lines
```python title="Code Block with title, line numbers and highlighted lines" linenums="1" hl_lines="2 3"
def bubble_sort(items):
    for i in range(len(items)):
        for j in range(len(items) - 1 - i):
            if items[j] > items[j + 1]:
                items[j], items[j + 1] = items[j + 1], items[j]
```
Code Block with title, line numbers and highlighted lines
1
2
3
4
5
def bubble_sort(items):
    for i in range(len(items)):
        for j in range(len(items) - 1 - i):
            if items[j] > items[j + 1]:
                items[j], items[j + 1] = items[j + 1], items[j]

Annotations can be added, using the comment syntax specific to the language, to add additional information to the code.

Code Block with annotations on line 2
```python title="Code Block with title, line numbers and highlighted lines" linenums="1" hl_lines="2 3"
def bubble_sort(items):
    for i in range(len(items)): # (1)!
        for j in range(len(items) - 1 - i):
            if items[j] > items[j + 1]:
                items[j], items[j + 1] = items[j + 1], items[j]
```

1. :material-comment-text-outline: Code Annotations can be included using the comment syntax specific to the language, such as ``\\..`` for Javascript and ``#...`` for Python and YAML.
Code Block with annotations on line 2
1
2
3
4
5
def bubble_sort(items):
    for i in range(len(items)): # (1)!
        for j in range(len(items) - 1 - i):
            if items[j] > items[j + 1]:
                items[j], items[j + 1] = items[j + 1], items[j]
  1. Code Annotations can be included using the comment syntax specific to the language, such as \\.. for Javascript and #... for Python and YAML.

Pygments provides support for many languages including the following.

```bash title=""
echo "Hello World!"
```
echo "Hello World!"
```c++ title=""
#include <iostream>

int main() 
{
    std::cout << "Hello World!\n";
    return 0;
}
```
#include <iostream>

int main() 
{
    std::cout << "Hello World!\n";
    return 0;
}
```javascript title=""
document.write("Hello World!");
```
document.write("Hello World!");
```go title=""
package main
import "fmt"

func main() {
    fmt.Println("Hello World!")
}
```
package main
import "fmt"

func main() {
    fmt.Println("Hello World!")
}
```python title=""
print("Hello World!")
```
print("Hello World!")
```yaml title=""
---
# This playbook prints a simple debug message
- name: Echo
hosts: 127.0.0.1
connection: local

tasks:
- name: Print debug message
    debug:
    msg: Hello, world!
```
---
# This playbook prints a simple debug message
- name: Echo
hosts: 127.0.0.1
connection: local

tasks:
- name: Print debug message
    debug:
    msg: Hello, world!

Inline

Syntax highlighting can be applied to inline code blocks by prefixing them with a shebang, i.e. #!, directly followed by the corresponding type.

The `#!python range()` function is used to generate a sequence of numbers.

The range() function is used to generate a sequence of numbers.

Quote

Use a Quote to include to cite something as a form of proof.

To create a Quote prefix a line with a >. If a Quote includes multiple lines add a > on each line and add a > on a blank line if the Quote includes multiple paragraphs.

> Complexity requires perfection, simplicity being the perfect state of man.
>
> *Piet Mondrian*

Complexity requires perfection, simplicity being the perfect state of man.

Piet Mondrian

To create a nested Quote include multiple >> for the nested line.

> Complexity requires perfection, simplicity being the perfect state of man.
>
>> Piet Mondrian

Complexity requires perfection, simplicity being the perfect state of man.

Piet Mondrian