Unit 02 · lesson

Jekyll `page`, `site`, and Built-In Variables

Jekyll page, site, and Built-In Variables

Once you understand a Liquid object, the next question is:

Where did that value come from?

Jekyll exposes several data scopes during rendering.

page

page represents data for the current page/document.

Custom front matter becomes available here.

---
title: Network Project
level: beginner
---
{{ page.title }}
{{ page.level }}

Jekyll also supplies page-related values such as URLs and other metadata depending on the content type.

site

site represents site-wide information and collections of content/data.

You will later use:

{{ site.title }}

and iterate structures such as:

site.posts
site.data

jekyll

Jekyll also exposes build-related data, including environment information used later for production/development behavior.

The rule is not "memorize everything in the variable reference."

The rule is:

Identify the scope that owns the data.

Guided inspection

Add a site title to _config.yml only if your project already has configuration introduced by your environment:

title: My Portfolio

Restart the Jekyll server after configuration changes when required.

Then compare:

{{ site.title }}
{{ page.title }}

One is site-wide.

One belongs to the current page.

Scope mistake

If you define title in page front matter but write:

{{ site.title }}

and get an unexpected value, the syntax may be valid.

Your scope is wrong.

That is a better diagnosis than "Liquid doesn't work."

Portfolio action

Identify three pieces of information and decide where they belong:

  • portfolio/site name;
  • current page title;
  • current page description.

Write:

Value:
Scope: site/page
Reason:

Checkpoint

For one generated page, mark every dynamic value you currently output as either site or page data.

If you cannot say who owns the value, you do not understand the template yet.