Writing posts

This post is over a year old, some of this information may be out of date.

The starter uses Gridsome's filesystem source plugin, which means blog posts are Markdown files that exist in the /content/posts directory.

Creating a new post

There are 2 ways you can create a new post with Bleda:

Simply add a new, uniquely-named *.md file in the /content/posts directory - duh!
In your terminal, navigate to the project root and run this command:
npm run newpost "My post title"
The quotes around the title are mandatory.

This will create a new file named YYYY-MM-DD-my-post-title.md under /content/posts.

Supported Front Matter keys

You can use the following Front Matter keys when creating a post:

---
title: "Post title" # required
slug: post-title-custom-url # optional, override the auto-generated post slug
description: "Lorem ipsum description sit amet" # required, used in meta tags and RSS feed
date: 2019-03-01 17:54:43 # required; time is optional, but recommended for the <time> tag and better post sorting control
author: bleda # optional
tags: ['markdown', 'design'] # optional
cover: https://example.com/path/to/cover/image.jpg # optional parallax post cover image
fullscreen: false # optional - when `true`, makes parallax cover image take up full viewport height
excerpt: "Custom excerpt to show in archive pages" # optional
---

Markdown syntax & styling

This is a short guide to using Markdown - see the full spec, or check out how Bleda styles it.

Formatting text

Headings

# This is an H1

## This is an H2

###### This is an H6

Paragraphs

A paragraph is simply one or more consecutive lines of text, separated by one or more blank lines. (A blank line is any line that looks like a blank line — a line containing nothing but spaces or tabs is considered blank.)

Normal paragraphs should not be indented with spaces or tabs.

Inline elements

Make text:

bold: **bold text**
italic: _italic text_
~~strikethrough~~: ~~strikethrough text~~
highlighted: <mark>highlighted text</mark>
link: [link text](https://example.com)

For links, you can also use the reference-style:

[link text][id] reference-style link.
[id]: https://example.com/  "Optional Title Here"

Lists

Unordered:

- one
- two
- three

Ordered:

1. one
2. two
3. three

Blockquotes

> Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aliquam hendrerit mi posuere.

Inserting Images

Local images are added with ![Image alt text](./images/image.jpg)

Of course, you can reference images from a CDN:

![Image alt text](https://example.com/image.jpg)

Linking images

With Markdown, do: [![Image alt text](https://example.com/path/to/image.jpg)](url to link to)

Dividing sections

Any of the following:

* * *

***

*****

- - -

---

---------------------------------------

... will create a <hr> like this one:

Code blocks

Both inline code and fenced codeblocks are supported.

To write inline code like this simply surround it with backticks: `some inline code`

Fenced codeblocks

Surround your code with triple backticks, like this:

    ```language
    your code here
    ```

Specify the language (reference) in order to get proper syntax highlighting:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
</head>
<body>
    <p>Lorem ipsum</p>
</body>
</html>

If you don't specify a language, the code block will not be wrapped in a <pre> tag, and will look like this:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
</head>
<body>
    <p>Lorem ipsum</p>
</body>
</html>

Cover photo by Joyce McCown.