Stand with Ukraine 🇺🇦
Eleventy
The possum is Eleventy’s mascot

Eleventy Documentation

This is an older version of Eleventy. Go to the newest Eleventy docs (current path: /docs/data-cascade/) or the full release history.
Menu
Community Resources:
IndieWeb Avatar for https://benmyers.dev/blog/eleventy-data-cascade/I Finally Understand Eleventy’s Data Cascade
Screenshot of https://benmyers.dev/blog/eleventy-data-cascade/
    + Add yours!

    The Data Cascade #

    In Eleventy, data is merged from multiple different sources before the template is rendered. The data is merged in what Eleventy calls the Data Cascade.

    Sources of Data #

    When the data is merged in the Eleventy Data Cascade, the order of priority for sources of data is (from highest priority to lowest):

    1. Computed Data
    2. Front Matter Data in a Template
    3. Front Matter Data in Layouts (only in 0.x)
    4. Template Data Files
    5. Directory Data Files (and ascending Parent Directories)
    6. Front Matter Data in Layouts (moved in 1.0)
    7. Configuration API Global Data
    8. Global Data Files

    Example #

    Filename my-template.md
    ---
    title: This is a Good Blog Post
    tags:
      - CSS
      - HTML
    layout: my-layout.njk
    ---
    Filename _includes/my-layout.njk
    ---
    title: This is a Very Good Blog Post
    author: Zach
    tags:
      - JavaScript
    ---

    Note that when my-template.md and my-layout.njk share data with the same object key (title and tags), the “leaf template” my-template.md takes precedence.

    The data cascade results in the following data when my-template.md is rendered:

    Syntax JavaScript
    {
      "title": "This is a Good Blog Post",
      "author": "Zach",
      "tags": [
        "CSS",
        "HTML",
        "JavaScript"
      ],
      "layout": "my-layout.njk"
    }

    By default in v1.0, Eleventy does a deep data merge to combine Object literals and Arrays. If you want to opt-out of this behavior and revert to a simple top level merge (Object.assign) from the different data sources, you can turn off Data Deep Merge. You can override this on a per-property basis too—read more at the Data Deep Merge documentation.

    Other pages in Using Data: