As a blog-aware static site generator, Jekyll is often turned to by developers that want to blog from their favourite text editor, using simple markdown, kramdown, or textile syntax.

Creating your first post

Now that we’ve got installing Jekyll covered, let’s create a post.

If you take a look at a typical directory structure involved in a Jekyll site, you’ll see that there’s a folder for posts. Inside of this folder is a collection of files written in the markup language of your choice (this site uses kramdown, for instance).

Adding each new post is as easy as adding a new file to this folder, ensuring that it has a few requirements.

File naming

The first requirement is a file naming convention, that follows YYYY-MM-DD-titleofpost.markuplanguage. For this particular post, the name is:

2016-05-04-blogging-with-jekyll.md

Front matter

The other requirement is a bit of front matter. It can be as basic as a title and a layout type, like so:

---
layout: post
title: "Blogging with Jekyll"
---

The front matter can be more advanced if you like, extending the post with meta information like categories, a date, images, and more. The full front matter for this post is:

---
layout: post
title: "Blogging with Jekyll"
date: 2016-05-04 00:05:15 -0400
tags: jekyll blogging
categories: news
image:
  feature: /img/slides/outerspace.jpg
---

The layout applies the post layout type, which decides how the post is displayed. The title, date, and category define metadata about the post that can be used in other layouts and templates.

For example, if you look at any of the other pages on this site, you’ll see a short list of recent posts that show the title and date of each.

If you look at the news page, you’ll see a directory of all the posts, including their title, date, and the featured image (which usually comes from a great site like Unsplash or Pexels).

Down to business

Once you’ve decided on the front matter you’d like to have for your post, you can go ahead and start writing like you would write any file in your preferred language.

After you’re finished and want to preview your post locally or generate the site for upload, you can either serve or build accordingly.

$ jekyll serve
$ jekyll build

Once you’re happy with the way things look, you can upload the contents of your site folder to your server, or commit and push to your git repo.

Lather, rinse, and repeat for further posts.

Share: