Configuration 282 posts
2026
Creating interactive transcripts
Dependency Spring Cleaning
In the spirit of seasonal home organizing, here are several dependency updates I’ve made to this site since my last refactor follow-up (most…
Tyler Sticka (5)
Cleaning House: Refactoring My Eleventy Config Into Modules
How I decomposed an 866-line .eleventy.js monolith into four focused modules, fixed some lurking bugs, and eliminated dead CSS and dead dependencies along the way.
Optimizing My Eleventy Build: An AI Use Note
Styles in Eleventy (Again)
A technical walkthrough on how I heavily optimized (and some would argue over-engineered) the CSS loading path on this Eleventy website.
Kitty Giraudel (16)
I Made My Eleventy Build 5× Faster with Five Changes
A walkthrough of how I audited my 11ty build benchmarks and cut cold-start time from 14 seconds down to 2.6 seconds by caching two custom filters and swapping out a bare network fetch.
Preserving DOM Changes Across Live Reloads
A technical walkthrough about a workaround to preserving client-side DOM changes across live reloads.
Kitty Giraudel (16)
Optimizing Images with Eleventy on Netlify
A short glance at the few steps I’ve taken to optimize images on this website, without compromising on build time.
Kitty Giraudel (16)
Feature Toggles with Eleventy
A short technical walkthrough on setting up feature toggles in Eleventy.
Kitty Giraudel (16)
Adding custom rendering to HTML elements in 11ty/Build Awesome
Ever wanted to change how HTML renders in 11ty? Perhaps inject a span or two into a link? Well have I got the post for you...
Jessie Heald (16)
Speeding Up Large 11ty Builds on Netlify
If your Eleventy site is starting to feel heavy on Netlify, a few small changes can make a noticeable difference.
Ryan Gittings (5)
The Limits of AI and Where Humans Shine
11ty Type Validation Schema
Simple Pure CSS/HTML Timeline (with Extra Eleventy Integration)
I wanted a simple historical timeline for a companion website for an academic presentation.
Micah Torcellini (2)
Little Dummies: Simple FPO Content Helpers
Video, links and code samples from my rapid prototyping talk for the final Eleventy Meetup.
Tyler Sticka (5)
Serving Markdown to LLMs with Eleventy
A technical walkthrough on how to serve a Markdown version of all pages with Eleventy.
Kitty Giraudel (16)
Adding Baseline Status to My Eleventy Site
How to integrate the baseline-status web component into Eleventy (Build Awesome) with per-page opt-in loading, Nunjucks shortcodes, and self-hosted scripts. Learn why Baseline provides clearer browser support signals than Can I Use for modern web features.
Stuart Robson (1)
Automatic Table of Contents with Eleventy
A technical walkthrough on how to automatically generate a table of contents for articles.
Kitty Giraudel (16)
Injecting element in Liquid content
A technical write-up on how to find a specific spot within a Liquid post content to inject an element.
Kitty Giraudel (16)
Eleventy: How to Work Around the “git Last Modified” Performance Bottleneck
On speeding up Eleventy sites when commit dates are too useful to drop.
TechLifeWeb rebuild
Precompressed HTML at the Edge: Eleventy Meets Cloudflare Workers
In this post, I will show you how I integrate Brotli level 11 compression directly into my 11ty build process to squeeze every possible byte out of my blog’s HTML.
Matt Hobbs (8)
Ignoring Files with Eleventy
Add a file named .eleventyignore in the root of your project, and add the files that you'd like to ignore. When Eleventy builds, it'll ignore said files.
Josh Sherman (4)
Deploying Your Own IndieWeb Site with Indiekit + Eleventy (Docker Compose based)
Deploying Your Own IndieWeb Site with Indiekit + Eleventy (Docker Compose based) 14 February 2026 indiekit indieweb deploy eleventy A complete guide to deploying Indiekit on...
Ricardo Mendes (1)
Running Eleventy + Puppeteer in Docker on macOS (Colima): The Full Journey
February 6, 2026 I wanted a Docker setup for my Eleventy resume project that also generates a PDF using Puppeteer. I assumed this would be straightforward. It wasn’t.
Nicholas Clooney (7)
Simple themeing strategies for simple websites
Been having some fun with website themes lately, here's a detailed blog post of how I manage them
Grigor Malo (3)
Seeking RSS links, favicons, and descriptions
Useful resources to help you add visible RSS links, favicons, and web page descriptions.
Bob Monsour (26)
Cache-busting that CSS & JS
On not minifying CSS & JS (part 2)
Better Handling Images on My 11ty Blog
Better image handling on my blog and pre-optimizing them all instead of using @11ty/eleventy-img plugin.
DeepakNess (8)
Minify those CSS & JS bundles? Maybe not.
Creating an Alphabetical Tag Page feat. Nunjucks Pitfalls
I transformed a messy tag list into an organized alphabetical sections, and there were a surprising amount of gotchas I encountered along the way.
Eleventy: Sorted Collection
This is the blog of Lea Rosema, frontend developer with accessibility focus, based in Hamburg
Lea Rosema (7)
An eleventy config for moving from Jekyll
Migrating from Cloudflare Pages to Workers (and cleaning up the mess)
My experience merging an 11ty static site and API into a single Cloudflare Worker, plus a bash script to delete old Pages deployments when the dashboard won't let you.
Alex Zappa (3)
2025
Building brennan.day Part One: Design, Rainbows, and Accessibility
A dive into how this site is built, why it exists, and the philosophy behind owning your corner of the web.
Notion meets Eleventy
The eleventy-from-notion plugin just got a major update. More features, more flexibility, and a better developer experience. Here's how!
vrugtehagel (3)
Cooling Down the Servers by Adding a Little Snow
Cool your servers off with some CSS snow as we wire up the snow-fall web component in a self hosted Eleventy setup, complete with color, count, and reduced motion tweaks.
Kyle Reddoch (8)
Eleventy (11ty) string-based translation with i18next
This article shows how you can make an Eleventy (11ty) website translatable on a string-by-string basis, supporting translation platforms such as Weblate.
Andrew Ward (5)
Mastering Eleventy: Display All Blog Posts from a Category on a Single Page
Have the same topic on your 11ty website and want to view them all on one page? Here's how to do so with just one extra file, and no plugins needed.
Gregory Hammond (3)
Creating a modular approach to json schema in an eleventy website
I wanted a modular and automated way to add json schema to my personal website so built a set of templates and some simple logic to populate the schema.
Simon Cox (17)
11ty OpenGraph & SEO
re implementing opengraph and meta tags in 11ty using javascript and nunjucks
equilibriumuk (21)
Wrapper Elements around Code Blocks in Markdown
A post by Zach Leatherman (zachleat)
Zach Leatherman (88)
TypeScript Mini Apps in Eleventy
DSri Seah (2)
Creating Cloudflare redirects
Notes on optimal ways to pull together a redirects file suitable for a Cloudflare hosted website.
Simon Cox (17)
Font Subsetting in Eleventy
eleventy-plugin-font-subsetting works fine but its configuration is finicky.
Shiv J.M. (13)
More Description
Let's continue Another WhileDo post. Of course, my amazing work yesterday had one fatal flaw and that is that the preview…
Martin Hähnel (14)
WhileDo
Instead of a How-To, I'll write a "WhileDo" today. This is my attempt to Write Like Ron Jeffries. After I published this…
Martin Hähnel (14)
An Addendum to Building My New Archives Page
After I posted about building my new archives page, I realized I could simplify the code using 11ty's built-in collections functionality.
Keith Wagner (5)
Building My New Archives Page
I'm making some big changes to my archives page in the redesign and thought I'd share how I'm building it.
Keith Wagner (5)
File organisation in Eleventy: Filters
I organise all my Eleventy filters into one file and register them as filters by iterating over them all in the configuration function.
Juha-Matti Santala (23)
From Dotclear to Eleventy 4
How to migrate a blog from Dotclear on to eleventy 4- Rebuild pages and navigation
Alix Guillard (4)
Adding a custom filename to a code block in Eleventy with markdown-it
Making those code blocks a little more personal.
Quick Start: Eleventy Shortcodes for Responsive Images & Inline SVG
Quick start to production-ready Eleventy shortcodes: responsive images with @11ty/eleventy-img and inline SVG helpers you can copy-paste and use immediately.
Emiliano Soravia (2)
Building a Multilingual Blog with Eleventy
My experience with making my English-Simplified Chinese bilingual personal blog with Eleventy and its official internalisation plugin.
Helen Chong (7)
From Start to Finish: Moving My Blog to Eleventy + GitHub Pages
A step-by-step guide on migrating my blog from using Weblog by OMGlol to Eleventy, hosted on GitHub Pages.
Kyle Reddoch (8)
Asset fingerprinting and the preload response header in 11ty
I’ll be building on my earlier post about CSS asset fingerprinting, this time adding the preload response header into the mix. Together, these techniques make sure your browser grabs my blog’s CSS right away, keeping things fast and seamless.
Matt Hobbs (8)
Conditional favicon in Eleventy using passthrough copy
Never mix up dev and prod again! (due to identical icons, at least)
Using Obsidian Callouts with 11ty
A simple guide on how to make an Obsidian style Callout or Information box
Aninus Partikler (1)
Updated My Draft System
Building This Website with Eleventy and Bulma
A look at the tech stack and decisions behind building my personal website using modern, simple tools.
Cache-Busting Assets in Eleventy
Generate a sourcemap and add it to Eleventy’s global data.
A Subtle Footgun in Eleventy’s Default Permalink Algorithm
How using a date-based directory structure for your site can bite you in the ass.
Evan Sheehan (8)
Blogging in markdown
Migrating an 11ty site from Cloudflare Pages to Workers
One weird trick to reduce Eleventy Image Build Times by 60%
Migrating An Eleventy Site to Bunny.Net
Chris McLeod is a software developer with over 20 years of experience. Sometimes he writes about it.
Chris McLeod (7)
Using HTMX boosted links in my 11ty website
Boosting links is a powerful technique that makes the navigation between pages of a statically generated website smoother.
Rigotti (1)
Proper Sitemap Update Dates for Eleventy
Generating LLMs.txt Using Eleventy
Large Language Models are increasingly relying on information found on the web, but often struggle to handle most websites in their entirety because the context windows are too small. In an...
Ariel Salminen (2)
A Slightly Improved Image Gallery for Eleventy
Blog about programming, scientific machine learning and the related techniques and methods.
Valentin Pratz (2)
Providing next event as API with Eleventy’s Global Data Files and Netlify Functions
I wanted to provide a programmatic access to the next event in our community’s event calendar and combined Eleventy and Netlify Functions to achieve it.
Juha-Matti Santala (23)
How To Make Eleventy Understand Obsidian-style Callouts
I really like callouts as a concept. If you're unfamiliar, they are a way to make a part of a note or post stand out. Because…
Martin Hähnel (14)
Double-Pagination in Eleventy
Yo dawg, I heard you liked pagination, so I added pagination inside your paginated pages, so you can paginate while you paginate.
Magick images
I’ve upgraded my site’s social media preview images, using a combination of ImageMagick and Eleventy. Here’s entirely too many words about how I made it all happen.
Ethan Marcotte (2)
How To Make Eleventy Understand Obsidian-style Wiki Links
I have started to use Obsidian as my blog editor and because of that I needed a simple way to make eleventy understand wiki…
Martin Hähnel (14)
How I Run Eleventy (It’s Complicated?)
Aliases, debug mode, non-versioned builds as part of a centralized, versioned site exports repo—and the thinking behind it all.
Adding base64 placeholder background images to eleventy-img
Dynamically creating QR codes in Eleventy
Rendering FreeMarker and Python page templates with 11ty
11ty, FreeMarker Generator, and Chameleon allow me to render FreeMarker and Python page templates to HTML within the same static site generator.
Tobias Fedder (7)
Journal Eleventy, présentation et mini-tutoriel
Recreating Search with Eleventy v3 and Netlify
While upgrading to version 3 of Eleventy, I discovered that the official serverless plugin was no longer supported. That was how this site's search feature worked. To finish the upgrade, I needed to write my own serverless code and plugin to manage it. While the details of how the search feature
Philip Renich (2)
eleventy-plugin-skiplink
This article is about: How and why I created a plugin to automatically create a skiplink for 11ty
David Moll (2)
Tweaking my 11ty blog to link to the Mastodon post defined in an Org Mode property
Sacha Chua (4)
Use Passthrough File Copy to Add Assets
Learn how to use the Passthrough File Copy feature to add static assets like CSS and JS to the output directory in the Eleventy (11ty) site.
Danial Zahid (6)
Moving to Eleventy
Crazy Mac lady. Mac author & developer. Lover of Apple computers and devices. Swift & SwiftUI enthusiast. Unofficial Mac app dev evangelist
Sarah Reichelt (1)
11ty Math
List blog posts grouped by year with Eleventy
A short guide on how to display blog posts grouped by year for a blog listing page in Eleventy using Nunjucks templating.
Juha-Matti Santala (23)
Eleventy's Image Plugin Disk Caching Approach For HTML Transform Method
In this guide, I'll walk you through an approach of utilizing disk cache while using the HTML transform method of the eleventy image plugin. Disk cache is a persistent cache which allows you to not re-optimize every single image at every single build. However, there are some caveats which I ran
Murtuzaali Surti (5)
Linking local node packages for development in PNPM
A personal blog documenting webdev, life with ADHD, home cooking, self-hosting, and much more
Ryan Killeen (1)
Swapping from Vue to Eleventy
Adding Pagefind Search to a Static Eleventy Site
Search is an essential feature on a website. But how to implement it on a static site?
slecache (1)
Extract Colors from an Image for CSS Themes
11ty Obsidian & Github Style Alert Blocks
Adding Obsidian & Github Style Alert / Callout Blocks Using 11ty and markdown-it Plugins
equilibriumuk (21)
11ty Markdown External Links Plugin
Setting target _blank and rel noopener noreferrer to external links using markdown-it + 11ty
equilibriumuk (21)
Adding a Button to Copy Code Snippets
How I added a button to copy code snippets to my website with JavaScript.
Helen Chong (7)
I made an Eleventy & Nix static site template
The markdown filters your Eleventy project needs
Migrating from my old Jekyll site to Eleventy meant two things, I lost a lot of out-of-the-box helpers, but at the same time gained the flexibility to extend any part of my site build pipeline via JavaScript.
11ty and OG images
Configuring your Content-Security-Policy on your development environment in 11ty
In this post, I investigate how you can use a mixture of dynamic and static Brotli compression with the Cloudflare Pro plan, for optimal web performance.
Matt Hobbs (8)
Adding Prettier in Eleventy using Transforms
Bernard Nijenhuis • Front-end Developer • Katwijk, The Netherlands • Father of 3 kids • Husband to 1 wife • Owner of 2 cats
Ok, this is my 'final' final word on RSS entry IDs
I've been able to fully automate the process of creating, at initial post time, a unique and permanent ID for each RSS feed entry.
Bob Monsour (26)
I wanted to validate the presence of an rssid in my front matter
Rather than have my RSS entry ID be missing, I wanted to validate its presence at build time.
Bob Monsour (26)
Let's create a plaintext RSS feed with 11ty
In this post I tackle something from my post-MVW (Minimum Viable Website) functionality to do list, by adding a plaintext RSS Feed. I'll take you through my reasons for adding it, the implementation, and the code I used to create it.
Matt Hobbs (8)
Integrating Eleventy with Buttondown to create subscribers-only content
Securing 11ty with SSL Locally
How to configure your eleventy serve process with ssl for localhost
Clayton Errington (20)
Using an 11ty Shortcode to craft a custom CSS pipeline
In this blog post, I'll show you how I've written an 11ty Shortcode to manipulate my CSS file, thus allowing for optimal long-life cache-control response headers. Any feedback on this build process would be greatly appreciated.
Matt Hobbs (8)
WP.SCSS
Increasingly I've been including 11ty in my WordPress builds as part of the theme. Great for static assets, such as
Rich Holman (2)
Display Plausible Statistics in Your 11ty Blog
How to display popular and trending blog posts using Plausible Analytics and 11ty. Follow this step-by-step guide for seamless API integration.
Joseph Jude (2)
Cranking Brotli up to 11 with Cloudflare Pro and 11ty
In this post I investigate how you can use a mixture of dynamic and static Brotli compression with the Cloudflare Pro plan, for optimal web performance.
Matt Hobbs (8)
11ty Clean blog and cleaner repository
building an 11ty site using Start Bootstrap's Clean bloog template for inspiration
Adam DJ Brett (10)
2024
Eleventy 3 Upgrade
I run quite a few sites on Eleventy; you can see the complete list on this site's Sites area. The Eleventy team released version 3.0 a while back and I finally got around to upgrading some of the sites. This post describes the process I used to migrate a couple of the sites.
John M. Wargo (47)
Displaying Eleventy Version on a Page
Describes how I display Eleventy build information on this site and how I had to change the process for Eleventy 3.0.
John M. Wargo (47)
Dec 9: Building a blog
A quick look at the tools we used to build our new blog & marketing site.
Callum Skeet (1)
Going all in with 'native' markdown
I've been typing way too much. There are simpler ways to use markdown for images and tables of contents. Here's how I'm doing it.
Bob Monsour (26)
Build static website with 11ty. Part 2
We continue the tutorial about building static websites with an 11ty site generator. In the previous part, we created a static website structure, configuration, pages, and links. This tutorial part is about adding CSS styles, dynamically generated pages, and dynamically generated sitemap. CSS Styles
ProDeveloper (2)
Adding Password Protection to 11ty Pages Using PageCrypt
When building static sites with Eleventy (11ty), you might occasionally need to password-protect certain pages. While static sites don't have built-in authentication mechanisms, we can implement client-side encryption using PageCrypt, a lightweight JavaScript solution that encrypts HTML content
Cody Sand (1)
Responsive, Self-hosted Images for Your Eleventy Blog
While you can certainly host your image files with the Git repo your Eleventy site is checked into, or add them manually after building it, neither option is ideal if you want responsive images in multiple formats to save precious bandwidth.
Sebin Nyshkim (3)
Building a Blog with Eleventy
I recently felt like getting back into blogging. But setting up and maintaining WordPress felt like more than I was looking for. I was looking for something much simpler. Preferably file-based and with Markdown support. That was my introduction to Eleventy.
Sebin Nyshkim (3)
How I teach Eleventy from scratch
I love how in Eleventy, you can build a site step-by-step and at each small step, have a functional website. In this post, I describe a workshop structure I’ve used lately to teach a few of my friends how to build a static site with Eleventy.
Juha-Matti Santala (23)
Eleventy Images Just Got Better
Eleventy 3.0 adds a new API to optimize images anywhere on your site, without shortcodes.
Dynamic Importing with Eleventy
After organising Eleventy filters, shortcodes etc I had an idea to tidy the code even more and make it dynamic. I wanted to automatically import any new functions that were added, including new when using files.
Trevor Morris (8)
Using Environment Variables in Eleventy Content Pages
Explains how you can use environment variables in Eleventy content pages
Organising Eleventy Filters, Shortcodes and more…
I work a lot with the Laravel framework, which scaffolds much of your initial setup and has conventions for where code should be stored. Starting a brand new Eleventy project from scratch doesn't give you this boilerplate and means you have to make decisions about where everything lives.
Trevor Morris (8)
Syntax highlighting in Eleventy
Nathan Smith (2)
IMPROVED ERROR MESSAGING FOR REQUIRE(ESM) IN NODE.JS
Adding Cooklang Support to my Eleventy Blog
How I added cooklang to my blog and the 11ty extension I created in the process
Matthew Paul (1)
THE SMORGASBORD OF WINDOWS TERMINAL… WINDOWS
Upgrade 11ty to v3, reorg, ESM, and debug
Webmentions and 11ty
Eleventy - Add CSV data file support
It would be cool to be able to drop a CSV file into a project and use it in a page. My motivation was to show bookshelves from my library database
Rob O'Leary (13)
Readable HTML and CSS
Virtual Templates in Eleventy
In Eleventy 3.0, virtual templates enable plugin authors to publish and share dynamic templates.
Getting started with Eleventy
The missing getting-started guide for the Eleventy (11ty) static-site generator.
Sean McPherson (3)
Eleventy - Merge external data with an existing collection
I wanted to make an archive of my writing, merging content I wrote for other websites with my exising 'posts' collection. Here is how I did it.
Rob O'Leary (13)
Upgraded to Eleventy v3
Create a Blog with Eleventy and Storyblok
This is a step-by-step tutorial on how to create a blog site using Eleventy and Storyblok.
Estela Franco (4)
Notifications for New Eleventy Posts in GitLab - Part 2
An implementation for identifying new posts in an Eleventy site built on GitLab pages and sending post-specific notifications (part 2 of 2).
Aaron Goldenthal (4)
Notifications for New Eleventy Posts in GitLab - Part 1
An implementation for identifying new posts in an Eleventy site built on GitLab pages and sending post-specific notifications (part 1 of 2).
Aaron Goldenthal (4)
Highlight Code Block Lines In Eleventy with Shiki Twoslash
Eleventy Markdown code block line highlighting made simple
Numbered Code Block Lines in Eleventy with Shiki Twoslash
Bringing in a third-party library for easy, reliable line numbering
Eleventy Layout and Template Files: A Complete Guide
Understand the basic concepts of Eleventy Layouts and Templates. Learn how the 11ty static site generator utilizes them in your Eleventy site.
Danial Zahid (6)
Automatic image pre-processing in Eleventy, Part 2
A post about the new automatic template image scaling support in Eleventy Image 4.0.0.
How I Eleventy
Documenting a refactor that introduced a folder structure and configuration changes, which summarises how I Eleventy.
Declan Byrd (2)
Adding inline SVGs to Eleventy.js
JavaScript software development tips, strategies for salary negotiation, and other helpful advice for navigating software as a career.
Jordan Kohl (8)
Eleventy: pathPrefix and GitHub Pages
Quick step-by-step recipe on how to deploy Eleventy site inside a subdirectory.
Łukasz Wójcik (2)
Eleventy - Group posts by year
A common organisation pattern for a blog is to group posts by year. I will show you how to do this efficiently and succinctly in JavaScript.
Rob O'Leary (13)
Updating 11ty to enjoy ESM
I updated the version of 11ty I use for this blog to the current alpha, to switch from CJS to ESM.
Tobias Fedder (7)
Eleventy: custom markup alongside item contents
Short and quick tutorial on how to embed custom HTML content between post paragraphs on an Eleventy site.
Łukasz Wójcik (2)
Eleventy - Differentiate between dev and production builds with unique favicons
It is easy to mix up the dev and production versions of a website in the browser. Let's make them look unique by using different favicons.
Rob O'Leary (13)
Keeping your Algolia search index up to date
How to connect Eleventy and Storyblok
This is a step-by-step tutorial on how to query data from Storyblok to use it in an Eleventy project.
Estela Franco (4)
LESSONS LEARNED MOVING ELEVENTY FROM COMMONJS TO ESM
Different favicon for development build
How to make tabs in the browser always show which build you’re working on.
Nikita Dubko (1)
Top 11 free Eleventy themes for 2024
Eleventy - Get autocompletion and doc info in your eleventy config in VS Code
In VS Code, you don't get autocompletion in your eleventy config. You don't get info about functions when you hover over them. Here is how you add it.
Rob O'Leary (13)
Low-tech Eleventy Categories
Eleventy has built-in tagging and collections capabilities that I’m riffing on to show you how to build a super simple category system with RSS feeds for each one.
Andy Bell (3)
Eleventy - Create a global production flag
A production flag enables you to run activites in production only e.g. minifying assets. There isn't a built-in flag in eleventy. How can we add one?
Rob O'Leary (13)
Mastering Eleventy Folder Structures: From Default Setups to Real-World Best Practices
Explore the essentials of Eleventy's folder structure in this guide, perfect for optimizing your project's efficiency and scalability. Learn from basic setups to advanced custom structures, ensuring your 11ty site is perfectly organized for peak performance.
Using 11ty to generate Open Graph images
Getting up to Speed with Eleventy: Config and Collections
Continuing his Eleventy tutorial, David Eastman shows how to configure the system, make use of templates, what collections are, and more.
David Eastman (2)
A Simple Guide to Redirects on Neocities with Eleventy
We need more tutorials for using Eleventy outside of Netlify. Lets take a look at setting up redirects on Neocities with Eleventy.
fLaMEd (11)
Hiding Future Posts in Eleventy
Describes how to hide posts with a future publishing date in an Eleventy site.
John M. Wargo (47)
Eleventy Photo Gallery
Minifying and compressing text files to reduce load
I am continuing to catch up with the technical basics for a modern‐day website. This time I add minification and compression to my 11ty build and the Caddy configuration.
Tobias Fedder (7)
2023
Building robots.txt from a simple API endpoint
Automatic pre-processing of post images in Eleventy
A brief description of how I set up automatic image scaling in Eleventy.
Generating and Caching Open Graph Images with Eleventy
How I'm caching my open graph images with eleventy-plugin-og-image instead of generating them on every build
Robb Knight (20)
Generating OG Images in Eleventy
Creating OG images for your Eleventy page is really easy with eleventy-plugin-og-image. I show you how!
Kilian Finger (1)
Generating a static blog with Eleventy
From 0 to minimal blog using 11ty. I tell you the steps I took to create the minimal technical basis for this website's content.
Tobias Fedder (7)
ELEVENTY V3 WITH ESM SUPPORT NOW ON THE CANARY CHANNEL
A post by Zach Leatherman (zachleat)
Zach Leatherman (88)
Maintaining working local links in Eleventy
How to keep links between Markdown files working both locally and on your Eleventy site.
Add a Sitemap (sitemap.xml) for Your Eleventy Website
Learn how to add an XML sitemap file for your Eleventy website. A complete tutorial for creating sitemap.xml for 11ty site.
Danial Zahid (6)
Add high-performance search to static sites with PageFind
The concise guide to using Pagefind for your static site’s search functionality.
Let’s create a microblog with visual editing using Bookshop and Eleventy
Visual editing is table stakes for a modern content management workflow.
Zach Leatherman (88)
Eleventy vs. Next.js for static site generation
We evaluate Eleventy and Next.js and compare both static site generators for performance, developer experience, scalability, and ecosystem.
Nelson Michael (2)
Eleventy WebC in a nutshell
How to schedule posts in Eleventy
Eleventy Excellent demo branches
Frontend developer and designer living in Madrid. I enjoy working with semantic HTML, vanilla Javascript and modern CSS.
Lene Saile (6)
Cleaning up the 11ty config
Learn how to organize your 11ty config file by creating separate plugin files. Improve maintainability and readability of your Eleventy project structure.
Simon Cox (17)
Clean Up Your Config File
TinaCMS + 11ty
Taking a deep dive into setting up a CMS for my static site with TinaCMS
Clayton Errington (20)
Making a lighthouse-fast website with a static site generator like 11ty
Build a Blogroll with Eleventy
A step-by-step guide to adding a blogroll, complete with each blog’s latest posts, to your Eleventy site.
Ben Myers (6)
CloudCannon + Eleventy
Getting CloudCannon setup with your Eleventy project is easier than you think
Clayton Errington (20)
11ty draft posts - Set up a draft system in 11ty
Build your own 11ty starter
If you want to build a website quickly then 11ty is a great tool. Here is how I set up my starter pack to get me up and running in a few minutes.
Simon Cox (17)
Favicon Generation In Eleventy
How I set up lastmod date in my 11ty xml sitemap
Google now want an accurate lastmod date in the xml sitemap. Here is how I set it up in my 11ty site.
Simon Cox (17)
Introducing: 11ty with reasonable defaults
TL;DR Initialize your 11ty projects with reasonable defaults: npm install -g yo npm... Tagged with showdev, webdev, productivity.
Winston Puckett (1)
Generating CSS with PostCSS and eleventy.before
I'm trying to keep the setup of my personal projects as simple as possible. Today, we're looking at how CSS is generated.
Martin Schneider (7)
Postcss 11ty Integration Update
I'm equilibriumuk, a software engineer. I write about programming & computer related topics
equilibriumuk (21)
11ty Postcss Integration Optimized
I'm equilibriumuk, a software engineer. I write about programming & computer related topics
equilibriumuk (21)
Integrating Tailwindcss With Eleventy
I'm equilibriumuk, a software engineer. I write about programming & computer related topics
equilibriumuk (21)
Integrating JSON-LD Into Your Eleventy Pages
CSS workflow and cache busters in 11ty
Embed JSDoc comments in an Eleventy website
How to embed JSDoc comments from an API into an Eleventy site to referecnce it rather than duplicate it.
Rob Anderson (5)
Meta Description and Keywords in Eleventy
Automated workflows for websites
In this article, I'm writing about automated workflows I added to this blog.
Lea Rosema (7)
Displaying Build Details in an Eleventy Site
I leveraged some old code to add the ability to capture build details and save them with a project. In this post, I describe the utility I created that allows you to easily display build information in an Eleventy site.
John M. Wargo (47)
Hiding drafts and future posts in Eleventy.js
JavaScript software development tips, strategies for salary negotiation, and other helpful advice for navigating software as a career.
Jordan Kohl (8)
Font Subsetting with Eleventy.js
Combining 11ty Static Site Generator with ASP.NET Core
Combining 11ty Static Site Generator with ASP.NET Core for maximum awesomeness.
Khalid Abuhakmeh (4)
Setup GitLab Review Apps with Eleventy
A technique to setup GitLab Review Apps for an Eleventy site, allowing a unique preview for each merge request.
Aaron Goldenthal (4)
Using Rmarkdown with Eleventy
How to programmatically add tags to posts in 11ty
Adding Wiki Links to 11ty
Components with Nunjucks and 11ty
We are going to be go through the first steps to get up and running with 11ty. Building a 11ty site from scratch will help you keep your site lightweight, scalable and easy to manage.
Jeremy Faucher (8)
External Asset Pipeline with Eleventy
I like to use NPM scripts for my asset pipeline instead of using Eleventy to generate assets and orchestrate everything. The latest release of Eleventy Dev Server makes that approach both easy to implement and quite performant.
Jérôme Coupé (10)
Using Eleventy filters in Directory Computed Data
Eleventy Computed Data makes it easy to reuse your filters outside of your templates.
Chris Coleman (2)
2022
Organizing the Eleventy config file
Eleventy lets you create a file called eleventy.js to configure the SSG to your own project’s needs. This article is all about organizing your config file!
Lene Saile (6)
Creating image galleries in eleventy(11ty) with elventy-img
I wanted to have image galleries on my site and Eleventy didn't have any plugins that did this already. So I added support for it on my own.
Why I built my own Vue plugin for Eleventy
Support Draft Blog Posts in Eleventy
You should add a generator tag to your Eleventy site
Generate a sitemap for your Eleventy website
How to create a sitemap for your static website built with Eleventy. Tagged with eleventy, sitemap, xml, staticsite.
Luciano Mammino (3)
Eleventy + Vue 3
Tips and tricks for using Vue 3 Single File Components as templates for Eleventy.
Fynn Becker (3)
11ty aliases the right way
A short little tutorial on how to make redirects in 11ty that aren't awful.
Evan Boehs (2)
Generate Social Image Covers With Eleventy And Node-Canvas
This static blog is generated with Eleventy and all its social images are automatically generated with node-canvas. In this tutorial we’ll set up a basic version of this script so you can use it on your blog as well.
Rik Schennink (1)
11ty tips I wish I knew from the start
2021
Eleventy 1.0 - Dynamic Ignores
An Adobe PDF Embed Plugin for Eleventy
Building a Simple Image Gallery with Eleventy
Create an Eleventy podcast feed
Want to add an iTunes and Google friendly podcast feed to your Eleventy site? Here's how.
Marc Littlemore (4)
Using Pre-Built Lunr Indexes with Eleventy
2020
Give your Eleventy Site Superpowers with Environment Variables
Eleventy is increasing in popularity because it allows us to create nice, simple websites, but also — because it’s so developer-friendly. We can build
Andy Bell (3)
Building my personal site with Eleventy
Software developer and team lead working remotely from Richmond, VA. Loves solving problems, grilling, tinkering with Home Assistant, metal shows, and his cats.
Michael Harley (14)
Inlining scripts and styles in 11ty
I’m Kitty Giraudel, a transfeminine web engineer based in Berlin, focused on accessibility and inclusivity.
Kitty Giraudel (16)
Using a folder other than posts/ with Eleventy
I don’t want to wrestle with overwrought Webpack configuration, write GraphQL queries for basic navigation, or scream at types for failing to transpile or whatever. I want to write
Eric Bailey (2)
Selecting Random Posts in Eleventy
Setting up Homebrew, NPM and Eleventy on a fresh mac
Walking through setting up Homebrew on your Mac, so you can install NPM and Eleventy.
Mike Street (13)
Add a generator meta tag to your Eleventy website
A generator meta tag is used to give some credit to the tools you use to build a plain HTML website. Let's give Eleventy some credit. Tagged with eleventy, jamstack, staticsite, javascript.
Luciano Mammino (3)
Five Critical Things To Do Before Working With 11ty
Five pieces of knowledge I wish I knew before working with 11ty, the JavaScript-based static site generator. Get a jump start using this fantastic tool.
Khalid Abuhakmeh (4)
Building a website with a static site generator, part 3: Domain, Analytics and Forms
Once your website is up and running, it's time to get a professional looking domain, think about analytics and collect data with forms.
Juha-Matti Santala (23)
Adding Another Template Language to Eleventy
Father, husband, developer relations and web standards expert, and cat demo builder.
Raymond Camden (105)