Skip to navigation Skip to main content
Black Lives Matter
Eleventy
Eleventy Documentation
Stable
2.0.1
Canary
3.0.0-alpha.9
Toggle Menu
Eleventy 1.93s
Next.js 70.65s

inputPathToUrl Universal Filter

Pre-release only: v3.0.0-alpha.5 Map a file’s location and to the template’s output URL. Very useful for robust hyperlinking allowing you to change your output URLs without breaking content links!

INFO:
This filter is an alternative to the InputPath To Url Plugin, which provides an Eleventy transform that is less verbose but a bit slower.

Inspired by GitHub issue #84.

Usage Jump to heading

View this example in: Liquid Nunjucks 11ty.js Handlebars
Syntax Liquid
<a href="{{ "index.md" | inputPathToUrl }}">Home</a>
Syntax Nunjucks
<a href="{{ "index.md" | inputPathToUrl }}">Home</a>
Syntax JavaScript (CommonJS)
module.exports = function (data) {
return `<a href="${this.inputPathToUrl("index.md")}">Home</a>`;
};
Syntax JavaScript (ESM)
export default function (data) {
return `<a href="${this.inputPathToUrl("index.md")}">Home</a>`;
}
Syntax Handlebars
<a href="{{inputPathToUrl 'index.md'}}">Home</a>

Renders as <a href="/">Home</a>.


← Back to Filters documentation.


Other pages in Filters: