_posts directory is a built-in feature for all Jekyll sites. Files you add under here are part of the “site.posts” collection. Jekyll uses a file name convention to provide date metadata and sorting.
Create your first post, dated for today.
Open the _posts directory, rename the file for today’s date
> cd _posts
> mv 2014-3-3-Hello-World.md 2018-10-18-Hello-World.md
Quiz: What file standardizes the look and feel of this post?
_layouts/post.html
Edit the File
Change your post’s title in the front matter
front matter is the top section of the file between the two dash lines. It defines a section of the file that contains variables and variable overrides for this piece of content, the “page” scope.
---
layout: post
title: I'm up and running!
---
Create your own post body
Everything under the front matter becomes the content of your blog post. Since this is an .md file, you can do some simple formatting with Markdown
If you are new to markdown
- # Is a Top, level 1 heading <h1>
- ## takes the heading down one notch
- * indicates a list item
- _italics here_
Blogging like a hacker at Connect Tech 2018!
Save and commit your changes
While We Wait
Jekyll is now re-rendering your site, and will show your new post shortly. While that happens, let’s take another look at templating and rendering.
File name into Date variables
Jekyll parses the page.date variable from the file name. The post layout uses a liquid filter to control date format output.
Written on {{ page.date | date: "%B %e, %Y" }}
Filters are the mechanism to do logic based formatting in Liquid Templates.
(Don’t worry, you’ll try some out in the next section.)
Rendered content ends up in _site directory
If you are working with a local build, Jekyll outputs all rendered pages to the _site directory. Since we’re dealing with static pages Jekyll relies on the permalink property for the final output file name. You can move a source file anywhere, Jekyll writes the output to folders and files based on permalink pattern defined.
permalink | output under site | url |
/:title | _site/page-title | /page-title |
/:title/ | _site/page-title/index.html | /page-title/ |
/:collection/:title | _site/folder/page-title | /folder/page-title |
/:collection/:title/ | _site/folder/page-title/index.html | /folder/page-title/ |