Static Site Blog Post Template (Front Matter)

Blog post with YAML front matter (title, date, draft, tags, description, slug) and Hugo, Jekyll and Astro differences

글쓰기 및 콘텐츠경량Hugo, Jekyll and Astro front matter conventionsstatic site post업데이트됨 2026. 10. 20.

사용법: Use when writing a post for a static site generator. Fill the front matter first and keep draft true until ready. The main pitfall is generator-specific rules, such as Jekyll's dated file names or Astro's schema validation.

미리보기

title	"[Post title]"
date	YYYY-MM-DD
draft	true
tags	["[tag-one]", "[tag-two]"]
description	"[One-sentence summary under 160 characters for search results and social cards]"
slug	"[post-slug]"

[Post title]

Blog post template for static site generators (Hugo, Jekyll, Astro and similar). It starts with YAML front matter, explains how the three generators differ, then gives a post body structure. Based on the documented conventions of each generator. Replace every [bracketed] value; delete the notes sections before publishing.

Front matter reference

The same fields, shown on their own so you can copy and adapt them:

---
title: "How we cut our build time in half"
date: 2026-10-21T09:00:00+07:00
draft: false
tags: ["ci", "performance", "github-actions"]
description: "Caching, parallel jobs and smaller images took our CI from 18 to 8 minutes."
slug: "cut-build-time-in-half"
---

Field	Purpose	Notes
`title`	Page title and heading	Quote it if it contains a colon
`date`	Publication date for sorting and feeds	Future dates may be hidden until that date
`draft`	Exclude from production builds	Remove or set `false` to publish
`tags`	Taxonomy pages and related posts	Use lowercase, hyphenated tags consistently
`description`	Meta description and social preview	120 to 160 characters
`slug`	URL segment	Lowercase, hyphens, no dates unless your permalinks need them

Generator differences

Topic	Hugo	Jekyll	Astro
Where posts live	`content/posts/` (or any section)	`_posts/`	`src/content/blog/` with a content collection
File name	Any, for example `my-post.md` or a page bundle `my-post/index.md`	Must be `YYYY-MM-DD-title.md`	Any; the file name is the default ID or slug
Drafts	`draft: true`, shown with `hugo server -D`	Put the file in `_drafts/`, or `published: false`; preview with `--drafts`	No built-in rule; filter `draft` yourself in the collection query
Front matter formats	YAML, TOML (`+++`) or JSON	YAML only	YAML; fields are validated by the collection schema
Slug	`slug` overrides the file name in the URL	`slug` used with the `permalink` pattern in `_config.yml`	Set via the collection loader or route; `slug` is a normal field you map
Tags	Built-in taxonomies (`tags`, `categories`)	`tags` and `categories` are built in	Define `tags` in the schema; build tag pages yourself
Summary	`description` or `summary`, or text before `<!--more-->`	`excerpt` or the first paragraph	Any field you define, usually `description`

Post body

Introduction

[Two or three sentences: the problem or question, who it is for, and what the reader will get from the post.]

[Main section 1]

[Explain the first key point with an example, code block or image.]

[Main section 2]

[Second key point. Keep headings descriptive so readers can skim.]

[Main section 3]

[Third key point, or a step-by-step walkthrough.]

Conclusion

[Summarise the takeaway in two sentences and suggest one next step, such as a related post or a link to the code.]

Before publishing

draft set to false (Hugo, Astro) or file moved to _posts/ (Jekyll).
Images stored next to the post or in the static folder, with alt text.
The local preview build shows the post at the expected URL.
Description reads well as a search snippet.

Standard and licence note

Based on the documented front matter conventions of Hugo, Jekyll and Astro. Generator behaviour changes between versions; check your version's documentation. Original text written for this collection. Template licence: MIT.