Markdown Basics

Introduction

Codebots Library articles are formatting using markdown.

You can use the edit bar to format to your article.

Alternatively, you can manually apply formatting using the following syntax.

Headings

The following markdown:

# Heading 1
## Heading 2
### Heading 3
#### Heading 4

Renders as:

Heading 1

Heading 2

Heading 3

Heading 4

Text Formatting

Adding emphasis

• To bold text, use **bold** or __bold__
• To italicise text, use *italics* or _italics_
• To add a strikethrough use ~~strikethrough~~

URLs

The markdown [Link Title](https://www.example.com) will render as Link Title.

Links to Codebots Library articles will automatically render with the articles title. So, the URL https://codebots.app/library-article/codebots/view/65/what-is-codebots will automatically render as https://codebots.app/library-article/codebots/view/65/what-is-codebots.

Lists

Markdown supports both ordered and unordered lists.

The following markdown:

1. Item 1
2. Item 2
    * Subitem a
    * Subitem b
3. Item 3

- Item 1
    Indented text
- Item 2
    - Subitem a
    - Subitem b
- Item 3

Renders as:

1. Item 1

2. Item 2

   • Subitem a
   • Subitem b
3. Item 3

• Item 1
  Indented text

• Item 2

  • Subitem a
  • Subitem b
• Item 3

Note that `* or - ` can both be used to indicated a bullet list.

Code blocks

Code blocks can be inline or fenced. They also support language tags for fenced code blocks.

The following markdown:

**Inline code block example**: `<p>Paragraph</p>`

**Fenced code block example**:
​```html
<div>
    <p>Paragraph</p>
</div>
​```

Renders as:

Inline code block example: <p>Paragraph</p>

Fenced code block example:

<div>
    <p>Paragraph</p>
</div>

Tables

To insert a table, you can click the table icon in the edit bar. Use three or more hyphens (---) to create each column’s header, and use pipes (|) to separate each column. You can use inline code blocks, emphasis, and links to format text inside table cells.

| Syntax | Description |
| ----------- | ----------- |
| Header | Title |
| Paragraph | Text |

To make the markdown table easier to read, you can you spaces to pad out the columns so they are a consistent width. They will display in the exact same way however, and in no ways controls the actual column width.

| Syntax    | Description |
| ------ -- | ----------- |
| Header    | Title       |
| Paragraph | Text        |

Footnotes

To insert a foot note add a foot note reference and the foot note itself. The reference represents what will become the super script number link that will appear above the text. For example: [^1] appears as ¹. Our footnote reference must reference our footnote. We can create this linkage through taking our footnote reference and appending a colon. For example: [^1]: Our footnote looks like this.

We can place a footnote in our sentence[^1].

[^1]: Footnotes will always be rendered at the bottom of the page.

Media

Images

To upload an image, simple click the image item in the edit bar.

To embed an image hosted elsewhere, the following syntax can be used: ![alt text](image.jpg)

For example, ![placeholder](https://via.placeholder.com/250) will render the following image, with the alt text “placeholder”.

Video

The Library includes the automatic embedding of videos from YouTube, Vimeo and Loom. To embed a video, simply paste the video URL. It is important that you use the regular share URL of the video, not the embedding URL. This URL will usually look something like this:

• Loom: https://www.loom.com/share/videoID
• YouTube: https://www.youtube.com/watch?v=videoID
• Vimeo: https://vimeo.com/videoID

If you want to include a video URL without embedding it, you will need to wrap it in a link using [title](url)

The library won’t render the video while you are editing, only once it has been published and someone is viewing it.