Writing a blog post

First you need to create a markdown file in the blog/post directory.

└─ blog
   └─ `posts`
       └─ 2021-11-4-writing-a-blog-post.md
       └─ ...

You can do this by creating a new file using the Blog Post template in forestry

From there it's the same as developing a normal markdown file. It is entirely up to you how to write your post.

Why do I need Markdown Slot?

First, let's review the relationship between layout components and markdown files:

Markdown files are providers of metadata (Page content, Configuration, etc.), while layout components consume them. We can use frontmatter to define some metadata for common data types, but frontmatter is hard to do something about markdown / HTML, a complex metadata that involves differences before and after compilation.

Markdown Slot is to solve this kind of problem.

## Code and Images

### Code
You can add code as a you normally will do for a markdown file.

output:

``` erlang
read_handler(#{node_id := N, attr := A} = Params, _State)
  when N =:= null; A =:= null ->
    {error, {invalid_params, Params}};

Images

Fist upload the image(s) in forestry's Media section.

Then there's two ways of using the images in a blog post:

1. Using markdown

WARNING

The dimentions of the image cannot be modified

input:

![GRiSP board](/images/blog/grisp-board-1.jpg)

output:

2. Using html and css

TIP

Use css classes to modify the image size and make it responsive.

If you need a full width responsive image use full-width class. This class is already defined in our styles.

input:

<style>
  .post-image {
    width: 50%;
    height: auto;
  }
</style>

<img src="/images/blog/grisp-board-1.jpg" alt="GRiSP board" class="post-image" />
<img src="/images/blog/grisp-board-1.jpg" alt="GRiSP board" class="full-width" />

output:

NOTE

The image path will always be /images/[file_name]

Custom Bloks

Custom Bloks can be used to highlight information.

Input:

::: tip
This is a tip
:::

::: info
This is a info
:::

::: warning
This is a warning
:::

::: danger
This is a dangerous warning
:::

Output:

TIP

This is a tip

INFO

This is a info

WARNING

This is a warning

DANGER

This is a dangerous warning

Custom title

Input:

::: tip NOTE
This is a tip with a custom title
:::

Output:

NOTE

This is a tip with a custom title