Pages
Create pages with Markdown and front matter.
Pages are where your content lives. Write them in Markdown, drop them in the pages/ folder, and Swifty turns them into beautiful HTML. Simple as that.
Your First Page
Create a Markdown file in pages/:
pages/hello.md
---
title: Hello World
---
# Welcome!
This is my first Swifty page. *Exciting times.*
Build your site and visit /hello - your page is live!
Front Matter
That stuff between the --- lines at the top? That's front matter. It's YAML that defines metadata about your page:
---
title: My Awesome Post
layout: blog
tags:
- tutorial
- swifty
position: 1
author: Your Name
anything_you_want: totally works
---
Built-in Properties
| Property | What it does |
|---|---|
title |
Page title (also used in navigation) |
layout |
Which layout to use (see Layouts) |
tags |
List of tags for categorization |
position |
Sort order in navigation (lower = first) |
draft |
Set to true to hide page in production builds |
date |
Page date; future dates hide the page until that date |
nav |
Set to true to include in main nav, false to exclude |
description |
Short description (used for Open Graph tags) |
image |
Image URL for social sharing (used for og:image) |
summary |
Brief summary of the page content |
Custom Properties
Here's the fun part: add any property you like and use it in your content:
---
title: Product Page
price: $29.99
rating: 5 stars
---
# <%= title %>
**Price:** <%= price %>
**Rating:** <%= rating %>
Your custom properties become template variables. Neat, right?
URLs Follow Folders
Your folder structure is your URL structure:
pages/
├── index.md → /
├── about.md → /about
├── blog/
│ ├── index.md → /blog
│ ├── first-post.md → /blog/first-post
│ └── second-post.md→ /blog/second-post
└── docs/
└── getting-started.md → /docs/getting-started
No config files, no route definitions. Just folders and files.
Convention Over Configuration
This is a concept borrowed from Ruby on Rails. Swifty makes smart assumptions so you don't have to configure everything:
- Pages in
blog/automatically uselayouts/blog.html(if it exists) - Pages in
docs/automatically uselayouts/docs.html(if it exists) - Navigation is generated from your folder structure
- Tags create their own pages automatically
You can override these defaults, but you often won't need to.
Draft Pages
Working on something that's not ready for prime time? Mark it as a draft:
---
title: My Work In Progress
draft: true
---
Draft pages:
- Show during development (
swifty start) - Hidden in production builds (
swifty build)
This means drafts won't appear in navigation, tag pages, or RSS feeds when you deploy. Perfect for previewing work before publishing.
Scheduled Pages
Want to publish a page at a future date? Just set the date in front matter:
---
title: Coming Soon
date: 2025-06-15
---
Pages with a future date:
- Show during development (
swifty start) - Hidden in production builds until the date arrives
This lets you write content ahead of time and have it automatically appear when you next build after the scheduled date.
Auto-Generated Goodness
Every page automatically gets some handy variables:
| Variable | What you get |
|---|---|
<%= breadcrumbs %> |
Breadcrumb navigation links |
<%= nav_links %> |
Top-level navigation links |
<%= links_to_children %> |
Links to child pages (for folder index pages) |
<%= links_to_siblings %> |
Links to sibling pages |
<%= links_to_tags %> |
Links to this page's tags |
<%= date %> |
Formatted last-modified date |
<%= created_at %> |
Formatted creation date |
<%= updated_at %> |
Formatted update date |
<%= word_count %> |
Number of words in the page |
<%= reading_time %> |
Estimated reading time (e.g., "2 min read") |
<%= prev_page %> |
Link to previous sibling page |
<%= next_page %> |
Link to next sibling page |
<%= og_tags %> |
Open Graph meta tags for social sharing |
<%= pagination %> |
Pagination navigation (for paginated folders) |
Just drop these into your layouts or pages wherever you need them.