Eleventy Navigation

Eleventy Navigation is an open-source plugin for the Eleventy static site generator that creates hierarchical navigation menus and breadcrumbs for multi-level content structures.

What is Eleventy Navigation?

Eleventy Navigation is a plugin for Eleventy (also called 11ty), a static site generator that compiles templates into plain HTML. It takes a set of pages organized with navigation metadata and produces structured navigation data that can be rendered as nested menus or breadcrumb trails. The plugin is maintained by the Eleventy project and is used in production on the official 11ty.dev documentation site, which demonstrates its reliability. Its full documentation is hosted at https://www.11ty.dev/docs/plugins/navigation/.

Key Features

• Hierarchical navigation — Builds multi-level navigation structures from your site's content organization, so nested menus reflect your page hierarchy.
• Breadcrumb support — Generates breadcrumb trails that show the path from the home page to the current page, helping users orient themselves.
• Production-proven — Used on the official 11ty.dev documentation site, where it handles navigation for a large set of documentation pages.
• Eleventy ecosystem — Listed under the topics eleventy and eleventy-plugin on GitHub, indicating it is built specifically for Eleventy and follows its plugin conventions.
• Open source — The source code is available on GitHub, and the repository has 107 stars at the time of writing, signaling community adoption.
• Documentation — Official documentation is available on 11ty.dev, including installation and usage instructions.

Who is it for?

• Eleventy developers who need to add navigation menus to static sites without writing custom build logic.
• Documentation site maintainers who manage large sets of pages that require structured navigation and breadcrumbs.
• Bloggers and content sites that organize posts into categories or sections and want automatic navigation generation.

What can you do with it?

• Build navigation menus — Let the plugin calculate parent-child relationships from your content, then render the menu in your template.
• Generate breadcrumbs — Display breadcrumb trails automatically for each page, improving usability in deep content hierarchies.
• Maintain consistent navigation — Update navigation by moving pages or editing metadata, without manually editing menu templates.

FAQ

Is Eleventy Navigation free?

Yes, the plugin is open source and available on GitHub. It is part of the Eleventy project's official plugins, which are distributed under an open-source license.

Does Eleventy Navigation support breadcrumbs?

Yes, breadcrumbs are supported out of the box. The plugin can generate a breadcrumb trail from the current page back to the home page.

Where can I find the documentation?

The full documentation is available at https://www.11ty.dev/docs/plugins/navigation/. It covers installation, configuration, and usage examples.

What is the relationship to Eleventy?

Eleventy Navigation is a companion plugin for Eleventy, the static site generator. It does not work as a standalone tool; it must be installed into an Eleventy project and configured via your Eleventy configuration file.

Can I use this plugin with other static site generators?

No, this plugin is designed specifically for Eleventy. It leverages Eleventy's data cascade and configuration interfaces, so it is not compatible with other generators.