Issue 68 - Color from images, Cache optimized images, A post to match the Meetup, New categories, Nice new sites...And 8 releases, 17 posts and 22 sites to see
Mar 4, 2025
6 minutes to read
Welcome to Issue 68 of the 11ty Bundle. 11ty, aka Eleventy, is a "simpler static site generator" that is designed to be simple, flexible, and highly customizable. It is built on Node.js and allows developers to create websites by transforming templates and data into static HTML files. It supports multiple template languages, giving developers the freedom to choose the languages that best suit the needs of their project.
An email version of this blog is available. Subscribe here.
A note from Bob:
I'm in a slightly elevated state of anxiety at the moment. I'm having my second knee replacement on March 6th and my wife just received a breast cancer diagnosis, which thankfully, was caught early. We're coping well and doing our best to keep our spirits up (notwithstanding the total clusterfuck that is the US presidency). I'm not sure how much I'll be able to do in the next few weeks. I'll do my best to keep adding posts, releases and sites, but I may take a break from these blog posts. I'll keep you posted. The best way to keep up with the posts is by subscribing to the Firehose RSS feed. There's also an RSS feed for releases.
Color from images. Zach created a new plugin, called image-color that extracts color information from images. Here's his blog post about it. It looks pretty cool and it's got me thinking of an idea on how I might use it.
Cache optimized images. And while this is something that I thought happened automagically when using the image transform, it turns out that you can have your optimized images placed into the .cache
folder which is great, particularly when using a deployment host like Netlify or Cloudflare (and perhaps others) that respect the .cache
folder between builds. Those optimied images can then be automatically copied to your output folder post-build. This should shave significant time off your builds, particularly for image heavy sites. Here's a Gitub issue that explains it.
A post to match the Meetup. At our recent Eleventy meetup, Sia had presented Using 11ty to build a data and chart analytics website (video). She has since followed that up with a blog post covering similar ground, titled How I built Shopify Theme Vitals using 11ty and CrUX. If you want to build a rich, data-driven site, there are learnings here.
New categories. I've created two new categories on this site, one for Notion and one for Obsidian. There seemed to be enough content to make these useful. So now when you do a search on either of these terms, you get right to the category, rather than get a rather repetitive list of posts. I hope you find this useful.
Nice new sites. Among the new sites in this issue, I wanted hightlight a few that caught my eye: Oregon Symphony Association, Green Web Tracker, and State of California Design System, and Damian Walsh's personal site.
Until next time...
Recent releases
Small utility to efficiently fetch the colors from an image. - 11ty/image-color
Feb 27, 2025
Utility to import content from multiple services (and a CLI, too) - Release Eleventy Import v1.0.14...
Feb 21, 2025
Utility to import content from multiple services (and a CLI, too) - Release Eleventy Import v1.0.13...
Feb 20, 2025
Eleventy Font Awesome v1.0.0-beta.8
Optimized per-page tree-shaken SVG spritesheets for Eleventy with Font Awesome icons. - Release...
Feb 19, 2025
Eleventy Font Awesome v1.0.0-beta.9
Optimized per-page tree-shaken SVG spritesheets for Eleventy with Font Awesome icons. - Release...
Feb 19, 2025
Eleventy Font Awesome v1.0.0-beta.10
Optimized per-page tree-shaken SVG spritesheets for Eleventy with Font Awesome icons. - Release...
Feb 19, 2025
A new performance-focused way to add interactive client-side components to your web site. - Release...
Feb 18, 2025
Eleventy Font Awesome v1.0.0-beta.7
Optimized per-page tree-shaken SVG spritesheets for Eleventy with Font Awesome icons. - Release...
Feb 18, 2025
Posts from around the web
Extract Colors from an Image for CSS Themes
A post by Zach Leatherman (zachleat)
Feb 27, 2025
by Zach Leatherman (48 posts) · Website & RSS feed
Categories: ConfigurationHow to...ImagesPlugins
How I Built Shopify Theme Vitals using 11ty and CrUX
Building a site that shows real-user web performance data by Shopify theme using HTTP Archive, the Chrome User Experience Report, BigQuery, Node, and 11ty
Feb 26, 2025
by Sia Karamalegos (13 posts) · Website & RSS feed
Categories: Global DataHow to...Performance
11ty Obsidian & Github Style Alert Blocks
Adding Obsidian & Github Style Alert / Callout Blocks Using 11ty and markdown-it Plugins
Feb 25, 2025
by equilibriumuk (18 posts) · Website & RSS feed
Categories: ConfigurationHow to...MarkdownObsidian
11ty Markdown External Links Plugin
Setting target _blank and rel noopener noreferrer to external links using markdown-it + 11ty
Feb 25, 2025
by equilibriumuk (18 posts) · Website & RSS feed
Categories: CSS/SassConfigurationHow to...Markdown
Building a personal digital music library with Eleventy and APIs
Building a personal digital music library with Eleventy and APIs
Feb 25, 2025
by Damian Walsh (1 post) · Website
Categories: CollectionsData CascadeFiltersGlobal DataImagesPaginationRemote Data
Embracing Tufte’s Design Principles in My New 11ty Starter
Adam DJ Brett Web Developer
Feb 23, 2025
by Adam DJ Brett (6 posts) · Website & RSS feed
Categories: BloggingGetting Started
My (Neo)Brutalism 11ty Web Design Experiments
Adam DJ Brett Web Developer
Feb 23, 2025
by Adam DJ Brett (6 posts) · Website & RSS feed
Categories: CSS/SassGetting Started
Welcome to my new new website!
Hello and welcome to my NEW new website. If everything goes well, it should look almost exactly the same[^1].Around nine years ago, I set this website up w...
Feb 22, 2025
by zmknox (1 post) · Website & RSS feed
Categories: Why Eleventy?
My Tiny Eleventy (11ty) Sites
Adam DJ Brett Web Developer
Feb 21, 2025
by Adam DJ Brett (6 posts) · Website & RSS feed
Categories: CSS/SassGetting Started
Adding a Button to Copy Code Snippets
How I added a button to copy code snippets to my website with JavaScript.
Feb 19, 2025
by Helen Chong (4 posts) · Website & RSS feed
Categories: AccessibilityConfigurationHow to...
DecapCMS with 11ty
Personal site for a coffee addicted geek
Feb 18, 2025
by DeaJae (2 posts) · Website & RSS feed
Categories: CMSConfigurationHow to...
WordPress to 11ty
Personal site for a coffee addicted geek
Feb 1, 2025
by DeaJae (2 posts) · Website & RSS feed
Categories: BloggingMigrating to Eleventy
Getting Started with 11ty, Minimalist, and Calavera
YouTube video
Feb 1, 2025
Categories: Getting StartedYouTube
Managing My Books Data
Why do something manually (that takes a few seconds to do), when a script (created over the course of several hours) can do it for you?
Jan 31, 2025
by Spencer Harston (2 posts) · Website & RSS feed
Categories: Global DataHow to...
Creating a Books Page
How and why I decided to create a Books page to keep track of my reading.
Jan 25, 2025
by Spencer Harston (2 posts) · Website & RSS feed
Categories: Global DataHow to...
Build personal blog easy with 11ty.js
Build personal blog site super easy with Eleventy JS, a simpler static generator.
Jan 14, 2025
by Hieu Le Van (1 post) · Website & RSS feed
Categories: BloggingDeploymentGetting StartedWhy Eleventy?
11ty and Obsidian Template for Solo Play
A quick intro to pushing out your own solo ttrpg recap website.
Jun 12, 2024
by Alex Ward (4 posts) · Website & RSS feed
Categories: DeploymentHow to...Obsidian
Built with Eleventy
Here are the new sites to see. If you want to see more sites, check out the Eleventy Leaderboards.
Heal the Reciprocal Relationship Between the Lake and Onondaga Nation #Lakeback
Benjamin Grant's primary online presence
A post by Zach Leatherman (zachleat)
Luke Warlow's portfolio site
Your official source for Oregon Symphony Tickets. Explore the Oregon Symphony located in Portland...
Systems Administrator and Freelance Theatre Audio Engineer and Designer. I think trains, public...
The website of a person who likes computers.
Hi 👋 I am a Software Engineer with over 5 years of experience in the tech industry.
We are two passionate media artists creating organically flowing realtime animations and sound...
Death, Taxes, and Off-By-One Errors
Hello! My name is Dex, and I'm currently a computer science student at a Canadian university.
One...
Tech consultants and web developers in Prestwich, Manchester
Renegade Solar - Solar panel and battery installations in Manchester
nannnsss head filled with pixels and dirt
State of California Design System
This system makes it easy to build digital services that meet the needs of Californians.
Tracking the progress of the internet towards 100% fossil free hosting. Updated every two weeks.
I'm Alison Keen and I help people with psychotherapy.
Lynn Fisher's Instagram Archive
A bunch of photos that were once on Instagram.
Crazy Mac lady. Mac author & developer. Lover of Apple computers and devices. Swift & SwiftUI...
Designer (Interaction/UX/UI) based in Manchester, UK