| CARVIEW |
Select Language
HTTP/2 200
access-control-allow-origin: *
age: 0
cache-control: public, max-age=0, must-revalidate
content-disposition: inline; filename="virtual-templates"
content-encoding: gzip
content-type: text/html; charset=utf-8
date: Sat, 11 Oct 2025 16:31:00 GMT
etag: W/"70390620a7c316016cb973b67dadf92b"
last-modified: Sat, 11 Oct 2025 16:31:00 GMT
server: Vercel
strict-transport-security: max-age=63072000
x-vercel-cache: HIT
x-vercel-id: bom1::mldjg-1760200260185-4e3c694a9ea1
Virtual Templates — Eleventy
- Stable
3.1.2- Canary
4.0.0-alpha.4
- Guide
Guide
- Plugins
- Services
Virtual Templates Added in v3.0.0
In addition to template files in your input directory, Eleventy can also process virtual templates defined in your configuration file (or plugins). Related GitHub #1612.
The RSS plugin offers a virtual template to add feeds to your project.
API
eleventyConfig.addTemplate(virtualPath, content, data = {});virtualPath: used to determine the template language and data cascade for this template. This path is relative to your project’s input directory.content: usually a string, but maybe JavaScript (if using an11ty.jstemplate). Can include front matter if the template language supports it.data: a data object tied to the template. A little more ergonomic than front matter but functionally the same.
Example
Markdown, HTML (via Liquid) Layout
eleventy.config.js
export default function(eleventyConfig) {
// Create content templates Files
eleventyConfig.addTemplate("virtual.md", `# Hello`, {
layout: "virtual.html"
});
// Works great with Layouts too
eleventyConfig.addTemplate("_includes/virtual.html", `<!-- Layout -->{{ content }}`);
};module.exports = function(eleventyConfig) {
// Create content templates Files
eleventyConfig.addTemplate("virtual.md", `# Hello`, {
layout: "virtual.html"
});
// Works great with Layouts too
eleventyConfig.addTemplate("_includes/virtual.html", `<!-- Layout -->{{ content }}`);
};JavaScript
Any of the JavaScript shapes on 11ty.js templates are also supported here.
eleventy.config.js
export default function(eleventyConfig) {
// Create content templates Files
eleventyConfig.addTemplate("virtual.11ty.js", function(data) {
return `<h1>Hello</h1>`;
});
};module.exports = function(eleventyConfig) {
// Create content templates Files
eleventyConfig.addTemplate("virtual.11ty.js", function(data) {
return `<h1>Hello</h1>`;
});
};