Here are the main features of Jekyll I used to generate all the static pages of this site.
$ ls
assets _config.yml _data Gemfile
Gemfile.lock _health _home _includes
_layouts _love _meaning _posts
robots.txt _wealth
The _config.yaml file content is:
title: "Kaue's Way of Life"
description: "Kaue's Way of Life."
url: "https://kaue.me"
author: "Kaue Silveira"
defaults:
-
scope:
path: ""
values:
layout: "default"
destination: ../server/_site
collections:
home:
output: true
permalink: /:title/
health:
output: true
permalink: /:collection/:title/
wealth:
output: true
permalink: /:collection/:title/
love:
output: true
permalink: /:collection/:title/
meaning:
output: true
permalink: /:collection/:title/
posts:
output: true
permalink:
/:collection/:year/:month/:day/:title/
sass:
style: compressed
plugins:
- jekyll-feed
I have multiple folders with specific content (home, health, wealth, love, meaning) plus the general posts folder.
I use the jekyll-feed plugin to generate the Atom (RSS-like) feed. This is the content of my Gemfile:
source 'https://rubygems.org'
group :jekyll_plugins do
gem "jekyll-feed"
end
This is what the content folders look like:
$ ls _home/
about.md changes.md goals.md health.md
home.md love.md meaning.md posts.md
self-evaluation.md wealth.md
$ ls _health/
exercise.md nutrition.md sleep.md
$ ls _posts/ | head -n 3
2018-11-25-dr-satching-panda-on-time....md
2018-11-25-matthew-walker-why-we-sleep....md
2018-11-25-stronglifts-5x5-workout-....md
Content files look like this:
$ cat _health/sleep.md | head
---
menu_order: 100
description: "Sleep."
---
# Sleep
{% include goals.md %}
## Challenges
I have some custom page attributes (like menu_order) and includes (like goals.md) which I cover next.
This converts a path into a list of parts:
{% assign categories = include.path |
split: "/" %}
{% unless categories contains "posts" and
categories.size > 2 %}
{% assign route="" %}
<br>
<ul class="breadcrumb">
{% for category in categories %}
{% assign route = route |
append: category | append: '/' %}
{% if forloop.last %}
<li class="active">
{{ category | capitalize }}
</li>
{% elsif category.size == 0 %}
<li><a href="{{ route }}">Home</a></li>
{% else %}
<li><a href="{{ route }}">
{{ category | capitalize }}
</a></li>
{% endif %}
{% endfor %}
</ul>
{% endunless %}
The specific content pages (like sleep.md above) include the corresponding goals using:
$ ls _includes/goals
awareness.md career.md exercise.md friends.md
fun.md good.md investing.md nutrition.md
parents.md partner.md saving.md sleep.md
$ cat _includes/goals.md
## Goals
{% include goals/{{ page.slug }}.md %}
The overall goals page lists all goals like:
{% assign titles_col = site.collections |
where: "label", "home" | first %}
{% assign titles = titles_col.docs |
where: "has_goals", "true" |
sort: 'menu_order' %}
{% for item in titles %}
{% assign subtitles_col = site.collections |
where: "label", item.slug | first %}
{% assign subtitles = subtitles_col.docs |
sort: 'menu_order' %}
## {{ item.title }}
{% for subitem in subtitles %}
### {{ subitem.title }}
{% include goals/{{ subitem.slug }}.md %}
{% endfor %}
{% endfor %}
This lists pages sorted by their menu_order:
{% assign pages = site.home |
where_exp: "item", "item.menu_order > 0" |
where_exp: "item",
"item.hide_from_menu != true" |
sort: 'menu_order' %}
{% for item in pages %}
<li
{% if item.url == page.url %}
class="active"
{% endif %}
>
<a href="{{ item.url }}">
{{ item.title }}
</a>
</li>
{% endfor %}
This lists sub-pages:
{% assign collection = site.collections |
where: "label", page.slug | first %}
{% if collection and page.slug != "posts" %}
## Pages
{% assign pages = collection.docs |
where_exp: "item", "item.menu_order > 0" |
where_exp: "item",
"item.hide_from_home != true" |
sort: 'menu_order' %}
{% for item in pages %}
<a href="{{ item.url }}">
{{ item.title }}
</a>
{% endfor %}
{% endif %}
This lists posts with a tag matching the current page (e.g. sleep):
{% if page.slug == "home" or
page.slug == "posts" %}
{% assign pages = site.posts %}
{% else %}
{% assign pages = site.tags[page.slug] %}
{% endif %}
{% if pages.size > 0 %}
## Posts
{% for item in pages limit:include.limit %}
<a href="{{ item.url }}">
{{ item.date | date_to_string }}:
{{ item.title }} [
{% for tag in item.tags %}
{{ tag | capitalize }}
{% unless forloop.last %},
{% endunless %}
{% endfor %}
]
</a>
{% endfor %}
{% endif %}
The layout conditionally includes dependencies only for the pages that need them, e.g.:
{% if page.include_math_plot %}
<script
src="https://unpkg.com/mathjs....js">
</script>
<script
src="https://cdn.plot.ly/plotly....js">
</script>
{% endif %}
{% if page.include_rouge %}
<link rel="stylesheet"
href="/assets/css/rouge.css">
{% endif %}
The layout also lists sub-pages and posts:
{% unless page.hide_subpages %}
{% capture pages_html %}
{% include pages.html %}
{% endcapture %}
{{ pages_html | markdownify }}
{% capture posts_html %}
{% include posts.html %}
{% endcapture %}
{{ posts_html | markdownify }}
{% endunless %}