Skip to main content

Issue 66 - Meetup reminder, Installing a JavaScript Runtime, Plug in your Font Awesome, A fruity red starter, From Instagram to Pixelfed, RSS entries are ID'd, A variety of posts, A new look here...And 10 releases, 24 posts and 5 sites to see

7 minutes to read

Welcome to Issue 66 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:

REMINDER. The next Eleventy Meetup is on the calendar for February 6th. It features yours truly on How I built my Books page. And Sia Karamalegos will cover Using 11ty to build a data and chart analytics website. The time is 9am Pacific. Hope to see some of you there!

Incidentally, I've reduced the number of RSS feed entries for this blog and the Firehose blog to 20 of the most recent entries. Funny thing, someone who recently subscribed to the Firehose feed told me of the 1,337 entries that were in the feed. I remarked to him that we had reached peak "Leet".


Installing a JavaScript Runtime. New on the Eleventy docs, Zach shows how to install Node or Deno for use with your Eleventy projects. Read more.

Plug in your Font Awesome. A new plugin, eleventy-plugin-font-awesome provides "Optimized per-page tree-shaken SVG spritesheets for Eleventy with Font Awesome icons."

A fruity red starter. Strawberry Starter is here. There's an Installation Guide, a User Reference, some Markdown Examples, and a FAQ & Troubleshooting page.

From Instagram to Pixelfed. With the reent mass migration from Instagram to Pixelfed, Robb Knight shows us how to bring those images into Eleventy.

RSS entries are ID'd. As some of you may have watched, I have thrashed around over the last week or so with RSS entry IDs. I place full blame on this recent obsession on Evan Sheehan's blog post, which catalyzed my journey. I worked on several incremental approaches until finally landing on a solution that I'm happy with. You can read all about it on Ok, this is my 'final' final word on RSS entry IDs. But you should read Evan's post first to have it all make sense. That 'final' post of mine also contains the full list of 7 posts that I wrote along the way. I'm done with this topic for now. I promise.

A variety of posts. This issue has everything from setting up a site with Tailwind, open graph images, plain text RSS feeds, a VS Code snippet for front matter, a 5-part series on builing a seasonal veg app, and much much more.

A new look here. I recently commissioned Andy Carolan to design a new OG image for the 11ty Bundle. I became interested in his work after seeing the images he created for HTML for People. You'll start seeing it on social media posts and in the email version of the blog. I'm very happy with the result. Thanks, Andy!

Here's what it looks like:

The new 11ty Bundle OG image

See if you can find all of the "11s" in the image.

Enjoy!

Until next time...


Recent releases

Eleventy Import v1.0.10

Utility to import content from multiple services (and a CLI, too) - Release Eleventy Import v1.0.10...

Eleventy Import v1.0.11

Utility to import content from multiple services (and a CLI, too) - Release Eleventy Import v1.0.11...

Eleventy Utils v2.0.1

Lower level internal utilities to share amongst Eleventy packages - Release Eleventy Utils v2.0.1 ·...

Eleventy Font Awesome v1.0.0-beta.6

Optimized per-page tree-shaken SVG spritesheets for Eleventy with Font Awesome icons. - Release...

Eleventy Plugin Vite v6.0.0

A plugin to use Vite with Eleventy. Contribute to 11ty/eleventy-plugin-vite development by creating...

Eleventy v3.0.1-alpha.4

A simpler site generator. Transforms a directory of templates (of varying types) into HTML. -...

Eleventy Bundle v3.0.1

Little bundles of code, little bundles of joy. Contribute to 11ty/eleventy-plugin-bundle development...

Eleventy WebC Plugin v0.12.0-beta.3

Adds support for WebC *.webc files to Eleventy. Contribute to 11ty/eleventy-plugin-webc development...

Eleventy WebC Plugin v0.12.0-beta.2

Adds support for WebC *.webc files to Eleventy. Contribute to 11ty/eleventy-plugin-webc development...

Eleventy WebC Plugin v0.12.0-beta.1

Adds support for WebC *.webc files to Eleventy. Contribute to 11ty/eleventy-plugin-webc development...

Posts from around the web

Loading Pixelfed Photos with Eleventy

How to load my latest photos from Pixelfed

Feb 3, 2025

Categories: How to...ImagesRemote Data

Set Up a Simple and Reliable Static Site Generator Using 11ty (Eleventy) + Tailwind CSS

https://nodejs.org/en/download https://git-scm.com/downloads Tailwind CSS will compile Tailwind CSS classes to CSS and Tailwind CLI will allow us to run…

Feb 2, 2025

Categories: CSS/SassDeploymentGetting Started

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

Feb 2, 2025

Categories: ConfigurationHow to...

Eleventy, Open Graph images and fun?

Getting 11ty's Image plugin to output Open Graph metadata and images

Feb 2, 2025

Categories: BloggingHow to...ImagesSocial Media

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.

Feb 2, 2025

Categories: BloggingConfigurationHow to...RSS

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.

Feb 1, 2025

Categories: ConfigurationHow to...RSS

My last word on RSS entry IDs

In an effort to create more robust and truly unique and permanent IDs for my RSS feed entries, I built a thing to help.

Jan 30, 2025

Categories: BloggingHow to...RSS

Let's create a plaintext RSS feed with 11ty

Frontend web developer, turned engineering manager.

Jan 29, 2025

Categories: AccessibilityBloggingConfigurationFiltersHow to...RSS

Displaying Webmentions

Displaying the number of reposts,

Jan 28, 2025

Categories: How to...PluginsWebmentions

Visual Studio Code Snippet for Markdown Frontmatter

Chris McLeod is a software developer with over 20 years of experience. Sometimes he writes about it.

Jan 27, 2025

Categories: Front MatterHow to...Markdown

Creating permanently unique entry IDs for RSS

I was inspired to create permanently unique entry IDs for my RSS feed after reading a post by Evan Sheehan.

Jan 27, 2025

Categories: BloggingFiltersHow to...RSS

Building a seasonal veg app with Eleventy. Part 5 - Scheduled functions with Netlify

Netlify has this feature in beta called . When I came across it, it sounded like a nice solution to the issue I mentioned in where I didn't want to intr...

Jan 27, 2025

Categories: DeploymentHow to...Scheduling

Securing 11ty with SSL Locally

How to configure your eleventy serve process with ssl for localhost

Jan 27, 2025

Categories: ConfigurationHow to...

Now Using 11ty V3

Finally upgrading to the latest version of Eleventy.

Jan 27, 2025

Categories: CMSPluginsUpgrading

Eleventy version 3: Just how fast can a website be?

Upgrading to eleventy version 3 offered the opportunity to rethink some things, and dive into how to get a website to load super fast. Lighthouse is now reporting one hundred across all four categories.

Jan 26, 2025

Categories: AnalyticsBloggingPerformanceSearch

Having your own website is great. You can use it to introduce yourself to the world, talk about your hobbies, show off your work achievements, promote causes you care about, and many other things. And you really can keep your site as simple as you want it to be. It is your website after all!...

Jan 24, 2025

Categories: DeploymentGlobal DataHow to...Image GalleriesImagesSocial Media

Building a seasonal veg app with Eleventy. Part 2 - Styling

I didn't have a plan on how I wanted to style this app before starting this. I didn't want to outright copy seasonal.today's, even though I really liked ...

Jan 23, 2025

Categories: CSS/Sass

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...

Jan 23, 2025

Categories: DeploymentPerformancePlugins

The Speed Trifecta: 11ty, Brotli 11, and CSS Fingerprinting

Frontend web developer, turned engineering manager.

Jan 23, 2025

Categories: CSS/SassDeploymentHow to...Performance

Building a seasonal veg app with Eleventy. Part 4 - Accessibility

After my first deploy, I did a quick check with Lighthouse to see how my metrics are looking.

I need 100 for all if I want to do well in the leade...

Jan 23, 2025

Categories: Accessibility

Building a seasonal veg app with Eleventy. Part 1

I wanted to learn for fun. Looking for inspo on what to build, I came across their which lists sites built with Eleventy that are top performing in Ligh...

Jan 22, 2025

Categories: DatesPagination

Built with Eleventy

Here are the new sites to see. If you want to see more sites, check out the Eleventy Leaderboards.

MoonSign

MoonSign conceives and executes uncommon signage, graphics, and lighting projects.

Cosmo

Webseiten für KMUs in ganz Österreich: Ihre individuelle, Google-optimierte Webseite – in weniger...

Brendan's Tech Blog

This is my technical blog. Brendan's home on the Information Superhighway.

Get the blog by email (or RSS)

Powered by Buttondown