The Trevor Project — Saving Young LGBTQ Lives
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-eleventy-supplied/) or the full release history.

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 (New in v0.3.4)
fileSlug: "myFile",

// For permalinks: inputPath minus template file extension (New in v0.9.0)
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/",

// 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 New in v0.3.4 #

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

inputPathpage.fileSlug Result

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

inputPathpage.fileSlug Result
"""" (empty)

filePathStem New in v0.9.0 #

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

eleventy Variable #

let eleventy = {

// 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:

Environment Variables #

Node.js exposes environment variables under process.env. Learn how to expose Environment Variables to your templates using JavaScript Data Files.

New in v1.0.0 Eleventy also supplies its own Eleventy-specific environment variables, usually intended for more advanced use cases. You can use these in your configuration or in data files as needed.

Other pages in Using Data: