Plugins 145 posts
Category: PLUGINS (145 posts)
2025
11ty OpenGraph & SEO
re implementing opengraph and meta tags in 11ty using javascript and nunjucks
By equilibriumuk (19 posts)
Wrapper Elements around Code Blocks in Markdown
Eleventy Launch
As I discussed previously, I’ve been rewriting this blog in a new tool called 11ty (aka Eleventy - the project’s devs aren’t consistent so I won’t be either). This is the first blog post written in the new blog engine, and the migration is complete!
By Ash Furrow (2 posts)
Font Subsetting in Eleventy
eleventy-plugin-font-subsetting works fine but its configuration is finicky.
By Shiv J.M. (13 posts)
More Description
Let's continue Another WhileDo post. Of course, my amazing work yesterday had one fatal flaw and that is that the preview…
By Martin Hähnel (14 posts)
11ty Hacks for Fun and Performance
Alex Russell on browsers, standards, and the process of progress.
By Alex Russell (1 post)
From Dotclear to Eleventy 5
How to migrate a blog from Dotclear on to eleventy
By Alix Guillard (4 posts)
Solving my Image Dimension Problem with an Eleventy Transform
Software engineering leader and occasional side project hacker.
By Brian Cantoni (6 posts)
Blogging in markdown
Completing the I18nPlugin installation
This is the second part of my experiment to standardize the structure of my blog using the built-in I18nPlugin
By Francis Beaudet (2 posts)
Making a multilingual website with Eleventy
When I made my web site multilingual, I did it all manually. I decided to try using the built-in I18nPlugin to see if I could do it in a more standard way. Here's how it went.
By Francis Beaudet (2 posts)
Website updates
Logging some updates I’ve made to my 11ty-powered website
By Laurence Hughes (4 posts)
From Nunjucks to Vento in Eleventy: a migration guide (kinda)
A few tips to refactor your njk into vto.
By Christopher Kirk-Nielsen (14 posts)
11ty RSS Feed Setup: Three Plugin Problems and How I Fixed Them
Dependency management, configuration conflicts, and deprecated APIs while setting up RSS feeds in 11ty
By Simon Rosenqvist (1 post)
Writing statistics for your Eleventy (11ty) blog
A short tutorial on how to create a writing stats page for Eleventy.
By Andrew Ward (5 posts)
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…
By Martin Hähnel (14 posts)
A Test of Eleventy Fetch
Taking VentoJS for a spin in Eleventy
Using Notion as CMS with Eleventy
In this article we'll walk through how to use my eleventy-from-notion plugin, so you'll be able to use Notion as your CMS to use with your Eleventy setup.
By vrugtehagel (2 posts)
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…
By Martin Hähnel (14 posts)
Dynamically creating QR codes in Eleventy
Check the speedometer on the brand new Blog Awesome (now with 11ty)
News and information from Font Awesome – the internet’s favorite icon set; mixed with musings and nerdery from the team behind it.
By Zach Leatherman (55 posts)
11ty Font Awesome SVG Plugin
Using 11ty plugin for font awesome svg icons with no clientside javascript
By equilibriumuk (19 posts)
Moving to Eleventy
Crazy Mac lady. Mac author & developer. Lover of Apple computers and devices. Swift & SwiftUI enthusiast. Unofficial Mac app dev evangelist
By Sarah Reichelt (1 post)
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
By Murtuzaali Surti (5 posts)
Linking local node packages for development in PNPM
A personal blog documenting webdev, life with ADHD, home cooking, self-hosting, and much more
By Ryan Killeen (1 post)
Extract Colors from an Image for CSS Themes
Better YouTube Embeds ~77% Faster
YouTube videos were significantly slowing down posts, so discovered this better technique.
By DeepakNess (4 posts)
Displaying Webmentions
I finally figured out displaying webmentions on my site without any client-side JavaScript!
By Reilly Spitzfaden (3 posts)
Building a seasonal veg app with Eleventy. Part 3 - Deploy with Netlify
Now that the basics of the app is done, its time to deploy. I felt like I had 3 choices: Github pages, Netlify or Vercel. All offer free services and al...
By Yasmin (5 posts)
Three titles (podcaster plugin)
Documentation website for eleventy-plugin-podcaster.
By Nathan Bottomley (2 posts)
O(M)G Images
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.
By John M. Wargo (45 posts)
Learning 11ty by adapting a Jekyll Template
Integrating Jupyter Notebook Cells in Eleventy Posts
Blog about programming, scientific machine learning and the related techniques and methods.
By Valentin Pratz (2 posts)
Open Graph Metadata and Images in Eleventy Made Easy
Blog posts are meant to be shared. When sharing links, you’ll often see a preview on social media and instant messengers. But how does it work and how can you do it with Eleventy?
By Sebin Nyshkim (3 posts)
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.
By Sebin Nyshkim (3 posts)
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.
By Juha-Matti Santala (22 posts)
Tips for Running 11ty on Cloudflare Pages
Eleventy Images Just Got Better
Eleventy 3.0 adds a new API to optimize images anywhere on your site, without shortcodes.
By Aleksandr Hovhannisyan (14 posts)
Simple Eleventy 3 Excerpts
Sometimes it makes sense to write a unique excerpt. But sometimes the beginning of the page content works well enough, which is why many…
By Tyler Sticka (3 posts)
Upgraded to Eleventy 3.0 (Beta)
My experience upgrading this blog to the latest Eleventy blog.
By Raymond Camden (104 posts)
July Project Updates
An update on two projects I’ve been working on—one new and one old—based on some development oversights I’ve made in the past that I’d like to prevent going forward.
By Chris Burnell (8 posts)
Aboard the Eleventy 3.0 Train
My developer portfolio and blog website has been officially upgraded to Eleventy 3.0.
By Helen Chong (7 posts)
Adding Cooklang Support to my Eleventy Blog
How I added cooklang to my blog and the 11ty extension I created in the process
By Matthew Paul (1 post)
Adding Github-Style Markdown Alerts to Eleventy
How I added support for callouts/alerts to this site
By Robb Knight (20 posts)
Displaying Line Numbers in 11ty Code Blocks
Add line numbers to 11ty code blocks with Prism and Markdown-it, bypassing the plugin's DOM-dependency by adjusting the renderer during the build process.
By Jonathan Lau (2 posts)
Readable HTML and CSS
Virtual Templates in Eleventy
In Eleventy 3.0, virtual templates enable plugin authors to publish and share dynamic templates.
By Aleksandr Hovhannisyan (14 posts)
notion2eleventy
notion2eleventy is a plugin for the Static Site Generator Eleventy (short: 11ty). It loads content from Notion into your 11ty directory. A status-based workflow ensures that only content that has changed is downloaded. The plugin is available as a Node module at npmjs.com.
By Stefan Brechbühl (3 posts)
Eleventy Image problem with Netlify's build
I used wrong slashes in my source code, so Netlify's build step failed while using Eleventy Image.
By Sami Määttä (6 posts)
2024 redesign
Highlight Code Block Lines In Eleventy with Shiki Twoslash
Eleventy Markdown code block line highlighting made simple
By Henry Bley-Vroman (4 posts)
Numbered Code Block Lines in Eleventy with Shiki Twoslash
Bringing in a third-party library for easy, reliable line numbering
By Henry Bley-Vroman (4 posts)
How I shaved 1.5 minutes off my Eleventy build time
I had a revelation earlier today that solved a long-standing performance issue I’ve been having with the initial build of my Eleventy website, and here’s how it saved me a bunch of time!
By Chris Burnell (8 posts)
Create an Interactive TOC from Markdown-Generated Content
Create an interactive TOC for Markdown in Static Site Generators using the Intersection Observer API.
By Jonathan Lau (2 posts)
Creating a Reading List with Eleventy and Omnivore
This website includes my personal reading list now. It was built using Eleventy and Omnivore, an approach described in this article.
By Tom Doe (10 posts)
Elevating Video Transcripts as Searchable Content
A post by Zach Leatherman (zachleat)
By Zach Leatherman (55 posts)
@fec/eleventy-plugin-asset-pipeline: Better Cache Busting with Eleventy
I have created an Eleventy plugin to easily implement cache busting and asset handling.
By Florian Eckerstorfer (9 posts)
Local links in Eleventy, Part 2
Eleventy now support automatic transforms from local paths to output URLs right out of the box.
By Martin Gunnarsson (9 posts)
Setting up image transforms in Eleventy
Eleventy added a transform option to process images in Eleventy v3.0.0-alpha.5 and Image v4.0.1 so, naturally, I had to set it up on my site. If you don't want to read this post, you can check out the full diff for the changes.
By Cory Dransfeldt (46 posts)
Eleventy 🤝 Immich
LESSONS LEARNED MOVING ELEVENTY FROM COMMONJS TO ESM
Super fast responsive image loading in Eleventy
Automatically optimise and serve images by type and size in Eleventy.
By Eystein Mack Alnaes (2 posts)
addRemoteData
Fetching Package Dependents from GitHub
Using linkedom to grab all repositories that are depending on my post graph plugin
By Robb Knight (20 posts)
Added Monthly Posts Heatmap To The Site
I added a Posts per Month heatmap to the site's Statistics page today.
By John M. Wargo (45 posts)
Pokédex Plugin for Eleventy
Hiding Future Posts in Eleventy
Describes how to hide posts with a future publishing date in an Eleventy site.
By John M. Wargo (45 posts)
Adding Site Search to Eleventy with pagefind-search
Chris McLeod is a software developer with over 20 years of experience. Sometimes he writes about it.
By Chris McLeod (7 posts)
My 11ty Plugins
A list of plugins that I have written for the eleventy static site generator.
By Simon Dann (11 posts)
2023
Automatic pre-processing of post images in Eleventy
A brief description of how I set up automatic image scaling in Eleventy.
By Martin Gunnarsson (9 posts)
Eleventy File List Plugin
Describes an Eleventy plugin I created that enables a site to display a list of downloadable files.
By John M. Wargo (45 posts)
December Updates to Eleventy Plugin Stats
I made some enhancements to my Eleventy Post Statistics plugin this month and this post describes the changes.
By John M. Wargo (45 posts)
Generating OG Images in Eleventy
Creating OG images for your Eleventy page is really easy with eleventy-plugin-og-image. I show you how!
By Kilian Finger (1 post)
Building a multi-language Taylor Swift Fan Site with CloudCannon and Eleventy (Zach's version)
Addition of Post Graphs to Stats page
Blog and general digital garden of the full stack programmer Simon Dann.
By Simon Dann (11 posts)
Eleventy Post Graph Plugin
Generate Github-style post distribution graph for your blog posts in Eleventy
By Robb Knight (20 posts)
Syntax highlighting code in Eleventy posts
A quick tutorial about how to enable syntax highlighting of code blocks in Eleventy posts
By Martin Gunnarsson (9 posts)
A new technique for image optimization: SVG short circuiting
A post by Zach Leatherman (zachleat)
By Zach Leatherman (55 posts)
Automatically optimize your images with Eleventy Image and CloudCannon
Websites are becoming increasingly visual and we're adding more and more image content to our sites — but these images need to be optimized.
By Zach Leatherman (55 posts)
Migrating from WordPress to Eleventy (part 2)
Better word counts and reading time in Eleventy (11ty)
A short tutorial on how to count words and determine the reading time using Eleventy.
By Andrew Ward (5 posts)
How to find backlinks using Eleventy (11ty)
A short tutorial on how to find backlinks (pages that link to the current page) using Eleventy
By Andrew Ward (5 posts)
What I learned making top-level.dev
A single purpose site that gives you all of the top level domains in one handy list.
By Ginger (7 posts)
classnames
Multiline Comment • The online journal of Ashur Cabrera
By Ashur Cabrera (8 posts)
Added Content Stats to Eleventy Plugin Post Statistics
This post describes some new enhancements to my Eleventy Plugin Post Statistics plugin.
By John M. Wargo (45 posts)
Integrating Tailwindcss With Eleventy
I'm equilibriumuk, a software engineer. I write about programming & computer related topics
By equilibriumuk (19 posts)
Eleventy Plugin: Green Links
Font Subsetting with Eleventy.js
Blog and general digital garden of the full stack programmer Simon Dann.
By Simon Dann (11 posts)
Code for copying code: the Eleventy edition
Here’s a workaround for including “copy” buttons in code blocks built by Prism-based syntax highlighting in Eleventy.
By Bryce Wray (26 posts)
How to programmatically add tags to posts in 11ty
Blog and general digital garden of the full stack programmer Simon Dann.
By Simon Dann (11 posts)
2022
Why I built my own Vue plugin for Eleventy
First Experience Building with Eleventy's WebC Plugin
My first attempt working with Eleventy's new Web Component plugin
By Raymond Camden (104 posts)
Manage your SVG files with Eleventy's render plugin
Using renderFile to keep things tidy.
By Christopher Kirk-Nielsen (14 posts)
11ty second 11ty: The Render Plugin Part 1
The Render plugin is comprised of two shortcodes for use in your Nunjucks, Liquid or JS templates. It’s a plugin that is bundled with the main 11ty NPM package and ready to use as soon as you nom install 11ty.
By Bryan Robinson (15 posts)
Optimizing Images with the 11ty Image Plugin
While imagery can enrich your content, it can also slow down your site if it’s not used responsibly. Learn how to use the official 11ty image plugin to create optimized and responsive images.
By Aleksandr Hovhannisyan (14 posts)
Let's Learn Eleventy (11 Part Series)
For the past couple of weeks I have been exploring Static Site Generators (SSG) in an effort to see... Tagged with ssg, eleventy.
By James Midzi (1 post)
Using the Eleventy Image plugin without a central image folder
Eleventy’s official image pre-processing plugin assumes you have a single folder with all your images in it. I needed something different, and this is how I did it.
By Graham F. Scott (5 posts)
Nicer Image URLs with eleventy-plugin-remark and remark-images
Website and blog of Florian Eckerstorfer, a web developer living and working in Vienna, Europe. He likes long walks, music and books.
By Florian Eckerstorfer (9 posts)
Eleventy + Vue 3
Tips and tricks for using Vue 3 Single File Components as templates for Eleventy.
By Fynn Becker (3 posts)
A 11ty Reading Time Plugin Quest
Blog and general digital garden of the full stack programmer Simon Dann.
By Simon Dann (11 posts)
2021
Eleventy 1.0 - Global Data via Plugins Example
A followup on my post concerning Eleventy's new addGloblData feature
By Raymond Camden (104 posts)
An Adobe PDF Embed Plugin for Eleventy
Eleventy users can now add a PDF Embed plugin to their sites
By Raymond Camden (104 posts)
Building a Database Driven Eleventy Site
Using a database (MySQL) to drive content for an Eleventy site
By Raymond Camden (104 posts)
Building a Simple Image Gallery with Eleventy
Using the Image plugin with Eleventy to build a simple gallery
By Raymond Camden (104 posts)
My year of Eleventy plugins
Exactly one year ago today, I published my first Eleventy plugin. Here are some of the things I’ve learned since then.
By Graham F. Scott (5 posts)
2020
RSS, a love letter and walkthrough for my Eleventy site
Software developer and team lead working remotely from Richmond, VA. Loves solving problems, grilling, tinkering with Home Assistant, metal shows, and his cats.
By Michael Harley (14 posts)
Configuring responsive and optimized images 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.
By Michael Harley (14 posts)
Embed Everything
I recently released a plugin for quickly embedding media in Eleventy sites. I think it has potential!
By Graham F. Scott (5 posts)
Adding Text Linting to Eleventy
An example of using Eleventy's Linter feature
By Raymond Camden (104 posts)
2019
Creating an 11ty Plugin - SVG Embed Tool
In the sites I’ve built with Eleventy (11ty) recently, I’ve found myself reusing a couple filters. This has involved me copying and pasting the code a lot. The solution? Create an 11ty Plugin.
By Bryan Robinson (15 posts)