11ty

Eleventy Documentation

This is an older version of Eleventy. Full release history. Go to the newest Eleventy docs. You could try /docs/config/ although it may not exist.

Documentation Pages

Configuration

Configuration is an optional feature. Add an .eleventy.js file to root directory of your project to override these configuration options with your own preferences.

Filename .eleventy.js
module.exports = {
dir: {
input: "views",
output: "dist"
}
};

Using the Configuration API

If you expose your config as a function instead of an object literal, we’ll pass in a config argument that you can use!

Filename .eleventy.js
module.exports = function(eleventyConfig) {
// Add a filter using the Config API
eleventyConfig.addFilter( "myFilter", function() {});

// You can return your Config object (optional).
return {
dir: {
input: "views"
}
};
};

This allows you further customization options using Eleventy’s provided helper methods.

Add Tags/Filters

Read more about Tags and Filters

Add Collections

Read more about Collections and Advanced Collection Filtering and Sorting.

Use Plugins

Read more about Plugins.

Configuration Options

Jump to:

Input Directory

Controls the top level directory that we’ll use to look for templates.

Input Directory
Object Keydir.input
Default Value. (current directory)
Valid OptionsAny valid directory.
Command Line Override--input

Example

Filename .eleventy.js
module.exports = {
    dir: {
        input: "views"
    }
};

Directory for Includes

Controls the directory inside which the template includes/extends/partials/etc can be found.

Includes Directory
Object Keydir.includes
Default_includes
Valid OptionsAny valid directory inside of dir.input
Command Line OverrideNone

Example

Filename .eleventy.js
module.exports = {
    dir: {
        // ⚠️ This value is relative to your input directory.
        includes: "SEND_INCLUDES"
    }
};

Directory for Global Data Files

Controls the directory inside which the global data template files, available to all templates, can be found. Read more about Global Data Files.

Data Files Directory
Object Keydir.data
Default_data
Valid OptionsAny valid directory inside of dir.input
Command Line OverrideNone

Example

Filename .eleventy.js
module.exports = {
    dir: {
        // ⚠️ This value is relative to your input directory.
        data: "lore"
    }
};

Output Directory

Controls the directory inside which the finished templates will be written to.

Output Directory
Object Keydir.output
Default_site
Valid OptionsAny string that will work as a directory name. Eleventy creates this if it doesn’t exist.
Command Line Override--output

Example

Filename .eleventy.js
module.exports = {
    dir: {
        output: "dist"
    }
};

Default template engine for global data files

The data.dir global data files run through this template engine before transforming to JSON. Read more about Global Data Files.

Data Template Engine
Object KeydataTemplateEngine
Defaultliquid
Valid OptionsA valid template engine short name or false
Command Line OverrideNone

Example

Filename .eleventy.js
module.exports = {
    "dataTemplateEngine": "njk"
};

Default template engine for Markdown files

Markdown files run through this template engine before transforming to HTML.

Markdown Template Engine
Object KeymarkdownTemplateEngine
Defaultliquid
Valid OptionsA valid template engine short name or false
Command Line OverrideNone

Example

Filename .eleventy.js
module.exports = {
    markdownTemplateEngine: "njk"
};

Default template engine for HTML files

HTML templates run through this template engine before transforming to (better) HTML.

HTML Template Engine
Object KeyhtmlTemplateEngine
Defaultliquid
Valid OptionsA valid template engine short name or false
Command Line OverrideNone

Example

Filename .eleventy.js
module.exports = {
    htmlTemplateEngine: "njk"
};

Template Formats

Specify which types of templates should be transformed.

Template Formats
Object KeytemplateFormats
Defaulthtml,liquid,ejs,md,hbs,mustache,haml,pug,njk
Valid OptionsArray of template engine short names
Command Line Override--formats (accepts a comma separated string)
Configuration APIsetTemplateFormats New in v0.2.14

Examples

Filename .eleventy.js
module.exports = {
    templateFormats: ["html", "liquid", "njk"]
};
Filename .eleventy.js
module.exports = function(eleventyConfig) {
    eleventyConfig.setTemplateFormats("html,liquid,njk");

    // Or:
    // eleventyConfig.setTemplateFormats([ "html", "liquid", "njk" ]);
};
eleventy --formats=html,liquid,njk

Deploy to a subdirectory with a Path Prefix

If your site lives in a different subdirectory (particularly useful with GitHub pages), use pathPrefix to specify this. It’s used by the url filter and inserted at the beginning of all absolute url href links. It does not affect your file structure. Leading or trailing slashes are all normalized away, so don’t worry about it.

Path Prefix
Object KeypathPrefix
Default/
Valid OptionsA prefix directory added to links
Command Line Override--pathprefix New in v0.2.11

Example

Filename .eleventy.js
module.exports = {
    pathPrefix: "/eleventy-base-blog/"
};

Deploy to https://11ty.github.io/eleventy-base-blog/ on GitHub pages without modifying your config. This allows you to use the same code-base to deploy to either GitHub pages or Netlify, like the eleventy-base-blog project does.

eleventy --pathprefix=eleventy-base-blog

Copy Files to Output using Pass-through File Copy

Files found (that don’t have a valid template engine) from white-listed file extensions (in templateFormats) will pass-through to the output directory. Read more about Pass-through Copy.

Pass-through Copy
Object KeypassthroughFileCopy
Defaulttrue
Valid Optionstrue or false
Command Line OverrideNone

Example

Filename .eleventy.js
module.exports = {
    passthroughFileCopy: false
};

Change exception case suffix for HTML files

If an HTML template has matching input and output directories, index.html files will have this suffix added to their output filename to prevent overwriting the template. Read more at Common Pitfalls.

Exception Suffix
Object KeyhtmlOutputSuffx
Default-o
Valid OptionsAny valid string
Command Line OverrideNone

Example

Filename .eleventy.js
module.exports = {
    htmlOutputSuffix: "-o"
};

Change File Suffix for Template and Directory Data Files

New in v0.5.3 When using Template and Directory Specific Data Files, to prevent file name conflicts with non-Eleventy files in the project directory, we scope these files with a unique-to-Eleventy suffix. This key is customizable using jsDataFileSuffix. For example, using .11tydata for this value will search for *.11tydata.js and *.11tydata.json data files. Read more about Template and Directory Specific Data Files.

File Suffix
Object KeyjsDataFileSuffix
Default.11tydata
Valid OptionsAny valid string
Command Line OverrideNone

Example

Filename .eleventy.js
module.exports = {
    jsDataFileSuffix: ".11tydata"
};

Transforms

(These used to be called Filters but were renamed to Transforms, to avoid confusion with Template Filters).

Transforms can modify a template’s output. For example, use a transform to format/prettify an HTML file with proper whitespace.

Transforms
Object Keyfilters (Deprecated and renamed, use the Configuration API instead)
Default{}
Valid OptionsObject literal
Command Line OverrideNone
Configuration APIaddTransform (This is definitely available in Eleventy v0.3.3 but was likely in earlier versions as well)

Transforms Example: Minify HTML Output

Filename .eleventy.js
const htmlmin = require("html-minifier");

module.exports = function(eleventyConfig) {
eleventyConfig.addTransform("htmlmin", function(content, outputPath) {
if( outputPath.endsWith(".html") ) {
let minified = htmlmin.minify(content, {
useShortDoctype: true,
removeComments: true,
collapseWhitespace: true
});
return minified;
}

return content;
});
};