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

Eleventy Documentation

Menu

Eleventy Supplied Data #

Here are a few data values we supply to your page that you can use in your templates:

page Variable: #

let page = {

// URL can be used in <a href> to link to other templates
// Note: This value will be `false` if `permalink` is set to `false`.
url: "/current/page/myFile/",

// For permalinks: inputPath filename minus template file extension
fileSlug: "myFile",

// For permalinks: inputPath minus template file extension
filePathStem: "/current/page/myFile",

// JS Date Object for current page (used to sort collections)
date: new Date(),

// The path to the original source file for the template
// Note: this will include your input directory path!
inputPath: "./current/page/myFile.md",

// Depends on your output directory (the default is _site)
// You probably won’t use this: `url` is better.
// Note: This value will be `false` if `permalink` is set to `false`.
outputPath: "./_site/current/page/myFile/index.html",

// Added in 1.0
// Useful with `page.filePathStem` when using custom file extensions.
outputFileExtension: "html"
};

date #

The date associated with the page. Defaults to the content’s file created date but can be overridden. Read more at Content Dates.

fileSlug #

The fileSlug variable is mapped from inputPath and is useful for creating your own clean permalinks.

inputPathpage.fileSlug Result
"2018-01-01.md""2018-01-01"
"2018-01-01-myFile.md""myFile"
"myDir/myFile.md""myFile"

fileSlug returns information on the parent directory if the file is an index template:

inputPathpage.fileSlug Result
"index.md""" (empty)
"myDir/index.md""myDir"
"myDir/2018-01-01-index.md""myDir"

filePathStem #

The filePathStem variable is mapped from inputPath and is useful if you’ve inherited a project that doesn’t use clean permalinks.

Careful with this one and remember that Cool URI’s don’t change.

If you absolutely need a file extension on your output, you might use it like this:

Syntax YAML Front Matter
---
permalink: "{{ page.filePathStem }}.html"
---

Example Output below is using the above permalink value.

inputPathpage.filePathStem ResultExample Output
"2018-01-01-myFile.md""myFile"myFile.html
"myDir/myFile.md""myDir/myFile"myDir/myFile.html

Coming soon in v2.0.0-canary.9 Deep-link to 3c49f22.

Want to change resource.md to write to /resource.html instead of /resource/index.html? Use this configuration API code sample.

Filename .eleventy.js
module.exports = function(eleventyConfig) {
eleventyConfig.addGlobalData("permalink", () => {
return (data) => `${data.page.filePathStem}.${data.page.outputFileExtension}`;
});
};
When using this approach for URLs without trailing slashes (file /resource.html -> url /resource), please do note that using trailing slashes with index.html files (file /resource/index.html -> url /resource/) is a bit friendlier on various Jamstack hosting providers. You may encounter unexpected 404 errors—make sure you study up on how this works and test appropriately!!

eleventy Variable New in v1.0.0 #

let eleventy = {

// Eleventy version
version: "1.0.1", // New in Eleventy v1.0.1

// For use with `<meta name="generator">`
generator: "Eleventy v1.0.1", // New in Eleventy v1.0.1

// Read more about their `process.env` counterparts below
env: {
// Absolute path to the directory in which
// you’ve run the Eleventy command.
root: "/Users/zachleat/myProject/",

// Absolute path to the current config file
config: "/Users/zachleat/myProject/.eleventy.js",

// The method, either `cli` or `script`
source: "cli",
},

serverless: {
// An object containing the values from any Dynamic URL
// slugs from Serverless paths
// e.g. A slug for /path/:id/ and a URL for /path/1/
// would give { id: 1 }
path: {}

// The `event.queryStringParameters` received from the
// serverless function. Note these are not available in
// Netlify On-demand Builders
// e.g. ?id=1 would be { id: 1 }
query: {},
}

};

Learn more about:

Eleventy Leaderboards:

Environment Variables on process.env #


Other pages in Using Data: