Jekyll provides powerful variable access through Liquid templating. Understanding these variables is essential for customizing your Jekyll site. Variables in Jekyll come from three main sources: site-level configuration, page-level front matter, and built-in system variables.

Site Variables

It’s from _config.yml

  • title: Hyun’s Tech Blog
  • pages.size: 408
  • posts.size: 450
  • site.categories.Obsidian.size:
  • site.categories.Jekyll.size:
    • titles, excerpt

  • site.data.navigation: {“name”=>”Home”, “link”=>”/”}{“name”=>”Programming”, “dropdown”=>[{“name”=>”Android”, “link”=>”/Android/”}, {“name”=>”C”, “link”=>”/C/”}, {“name”=>”Career”, “link”=>”/Career/”}, {“name”=>”Programming”, “link”=>”/Programming/”}, {“name”=>”Golang”, “link”=>”/Golang/”}, {“name”=>”Java”, “link”=>”/Java/”}, {“name”=>”Kotlin”, “link”=>”/Kotlin/”}, {“name”=>”Methodology”, “link”=>”/Methodology/”}, {“name”=>”Python”, “link”=>”/Python/”}, {“name”=>”Ruby”, “link”=>”/Ruby/”}, {“name”=>”Scala”, “link”=>”/Scala/”}]}{“name”=>”Frontend”, “dropdown”=>[{“name”=>”Frontend”, “link”=>”/Frontend/”}, {“name”=>”JavaScript”, “link”=>”/JavaScript/”}, {“name”=>”NodeJS”, “link”=>”/NodeJS/”}]}{“name”=>”Mobile”, “dropdown”=>[{“name”=>”Android”, “link”=>”/Android/”}, {“name”=>”Mobile”, “link”=>”/Mobile/”}]}{“name”=>”Backend”, “dropdown”=>[{“name”=>”Database”, “link”=>”/Database/”}, {“name”=>”Kotlin”, “link”=>”/Kotlin/”}, {“name”=>”Spring”, “link”=>”/Spring/”}]}{“name”=>”Infra”, “dropdown”=>[{“name”=>”Automation”, “link”=>”/Automation/”}, {“name”=>”DevOps”, “link”=>”/DevOps/”}, {“name”=>”Security”, “link”=>”/Security/”}, {“name”=>”Spark”, “link”=>”/Spark/”}]}{“name”=>”Tools”, “dropdown”=>[{“name”=>”Tools”, “link”=>”/Tools/”}, {“name”=>”Jekyll”, “link”=>”/Jekyll/”}, {“name”=>”Mac”, “link”=>”/Mac/”}, {“name”=>”Obsidian”, “link”=>”/Obsidian/”}]}{“name”=>”Language”, “dropdown”=>[{“name”=>”Arabic”, “link”=>”/Arabic/”}, {“name”=>”Chinese”, “link”=>”/Chinese/”}, {“name”=>”English”, “link”=>”/English/”}, {“name”=>”Hindi”, “link”=>”/Hindi/”}, {“name”=>”Indonesian”, “link”=>”/Indonesian/”}, {“name”=>”Korean”, “link”=>”/Korean/”}]}{“name”=>”Knowledge”, “dropdown”=>[{“name”=>”AI”, “link”=>”/AI/”}, {“name”=>”Knowledge”, “link”=>”/Knowledge/”}, {“name”=>”Health”, “link”=>”/Health/”}, {“name”=>”History”, “link”=>”/History/”}, {“name”=>”Home”, “link”=>”/Home/”}, {“name”=>”Invest”, “link”=>”/Invest/”}, {“name”=>”Law”, “link”=>”/Law/”}, {“name”=>”Life”, “link”=>”/Life/”}, {“name”=>”Miscellanea”, “link”=>”/Miscellanea/”}, {“name”=>”Parenting”, “link”=>”/Parenting/”}, {“name”=>”Science”, “link”=>”/Science/”}, {“name”=>”Technology”, “link”=>”/Technology/”}]}{“name”=>”About”, “link”=>”/about”}

Key Site Variables Reference

Variable Description
site.title Site title from _config.yml
site.url Base URL of the site
site.baseurl Subpath of the site (e.g., /blog)
site.posts All posts in reverse chronological order
site.pages All pages
site.categories Posts grouped by category
site.tags Posts grouped by tag
site.data Data loaded from YAML files in _data/
site.time Time when the site was built
site.static_files All static files (non-processed files)

Any custom variable you add to _config.yml is also accessible via site.variable_name. For example, if you add author: John to your config, you can access it with {{ site.author }}.

Working with site.data

The _data/ directory allows you to store structured data in YAML, JSON, or CSV files. This is useful for navigation menus, team member lists, or any repeated data:

# _data/navigation.yml
- name: Home
  link: /
- name: About
  link: /about/
- name: Blog
  link: /blog/

Access it with site.data.navigation (the filename without extension).

Page Variables

  • Title: Jekyll Variables Usage - Site, Page, and Custom Variables
  • path: _posts/tools/jekyll/2023-12-04-jekyll-variables.md
  • url: /tools/jekyll/2023/12/03/jekyll-variables.html
  • variable: some_page_variable
  • categories: toolsjekyll

Key Page Variables Reference

Variable Description
page.title Title from front matter
page.date Date assigned to the post
page.url URL of the post without the domain
page.path Path to the raw post file
page.categories Categories the post belongs to
page.tags Tags assigned to the post
page.content Content of the page (rendered)
page.excerpt First paragraph of the post
page.id Unique identifier for the post
page.next Next post in chronological order
page.previous Previous post in chronological order

Custom Front Matter Variables

Any variable you define in the front matter is accessible through page.variable_name:

---
layout: post
title: My Post
author: John
sidebar: true
custom_css: special-page
---

You can then use these in your templates:

{% if page.sidebar %}
  {% include sidebar.html %}
{% endif %}

{% if page.custom_css %}
  <link rel="stylesheet" href="/assets/css/{{ page.custom_css }}.css">
{% endif %}

Layout Variables

When working inside a layout file, you can access the layout object:

{{ layout.title }}

Layout variables come from the front matter of the layout file itself.

Content Variable

The content variable is special and only available in layout files. It contains the rendered content of the page that uses the layout:

<!-- _layouts/post.html -->
<article>
  <h1>{{ page.title }}</h1>
  {{ content }}
</article>

Paginator Variables

If you use the jekyll-paginate plugin, the paginator object provides pagination variables:

Variable Description
paginator.page Current page number
paginator.total_pages Total number of pages
paginator.posts Posts on the current page
paginator.previous_page Previous page number
paginator.next_page Next page number

Practical Tips

  1. Debug with jsonify: To inspect what data is available, use the jsonify filter: {{ site.data.navigation | jsonify }}
  2. Check for nil: Always use default values or nil checks to prevent rendering issues: {{ page.author | default: site.author }}
  3. Performance: Avoid iterating over site.posts in frequently rendered includes, as it can slow down build times on large sites. Use limit when possible.
  4. Environment variable: Use jekyll.environment to conditionally include scripts (like analytics) only in production: {% if jekyll.environment == "production" %}