Menu
- Why Eleventy?
- Getting Started
- Community
- Working with Templates
- Using Data
- Configuration
- Template Languages
- Plugins
- API Services
- Release History
- Advanced
5.81s
12.52s
Eleventy Supplied Data
Contents
Here are a few data values we supply to your page that you can use in your templates:
pkg
: The local project’spackage.json
values.pagination
, when enabled using pagination in front matter. Read more about Pagination.collections
: Lists of all of your content, grouped by tags. Read more about Collectionspage
: Has information about the current page. See code block below forpage
contents. For example,page.url
is useful for finding the current page in a collection. Read more about Collections (look at Example: Navigation Links with anactive
class added for on the current page).eleventy
: Added in v1.0.0 contains Eleventy-specific data from environment variables and the Serverless plugin (if used).
page
Variable
Jump to heading
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",
// Available in 2.0 with the i18n plugin
// The default is the value of `defaultLanguage` passed to the i18n plugin
lang: "",
};
- Note that
page.lang
is only available when the i18n plugin has been added to your configuration file.
Feature Availability Jump to heading
The data in page
is also available as:
this.page
on Shortcodesthis.page
on Filters, Transforms, and Linters Added in v2.0.0-beta.1page
on Collection entries Added in v2.0.0-beta.1
date
Jump to heading
The date associated with the page. Defaults to the content’s file created date but can be overridden. Read more at Content Dates.
fileSlug
Jump to heading
The fileSlug
variable is mapped from inputPath
, and is useful for creating your own clean permalinks.
inputPath |
page.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:
inputPath |
page.fileSlug Result |
---|---|
"index.md" |
"" (empty) |
"myDir/index.md" |
"myDir" |
"myDir/2018-01-01-index.md" |
"myDir" |
"2018-01-01-myDir/index.md" |
"myDir" Added in v2.0.0-beta.1 |
filePathStem
Jump to heading
The filePathStem
variable is mapped from inputPath
, and is useful if you’ve inherited a project that doesn’t use clean permalinks.
If you absolutely need a file extension on your output, you might use it like this:
---
permalink: "{{ page.filePathStem }}.html"
---
This example output uses the above permalink value.
inputPath |
page.filePathStem Result |
Example Output |
---|---|---|
"2018-01-01-myFile.md" |
"myFile" |
myFile.html |
"myDir/myFile.md" |
"myDir/myFile" |
myDir/myFile.html |
Changing your project default permalinks Jump to heading
Added in v2.0.0-beta.1 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.
module.exports = function(eleventyConfig) {
eleventyConfig.addGlobalData("permalink", () => {
return (data) => `${data.page.filePathStem}.${data.page.outputFileExtension}`;
});
};
/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 Added in v1.0.0
Jump to heading
let eleventy = {
// Eleventy version
version: "1.0.1", // New in v1.0.1
// For use with `<meta name="generator">`
generator: "Eleventy v1.0.1", // New in 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",
// One of `serve`, `watch`, or `build`
runMode: "build", // New in v2.0.0-beta.2
},
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: {},
}
};
Feature Availability Jump to heading
The data in eleventy
is also available as:
this.eleventy
on Shortcodes Added in v2.0.0-beta.1this.eleventy
on Filters Added in v2.0.0-beta.1
Use with meta name="generator"
Added in v1.0.1
Jump to heading
It’s helpful if you add <meta name="generator">
to your existing Eleventy project as shown below. Learn more from David Darnes’ blog post: You should add a generator tag to your Eleventy site.
<meta name="generator" content="{{ eleventy.generator }}">
These videos also provide some additional context as to why this is important:
Learn more Jump to heading
- Eleventy-supplied Environment Variables on
process.env
- Serverless
- Dynamic Slugs and Serverless Global Data.
event.queryStringParameters
, which are very similar to URL.searchParams. It’s an object representing the name/value pairs for things after the?
in a URL.
Environment Variables on process.env
Jump to heading
- Read more about Eleventy-supplied environment variables.