Firehose 1,608
2022
Importing external components in WebC via NPM
From Notion to Eleventy, but faster
Drafts and timestamp-based publishing in Eleventy
Exercise more control over when, and if, your posts appear.
By Bryce Wray (26 posts)
11 Top Eleventy Blog Themes (Starters) in 2023
This article takes a top ten list of blog themes and turns it up to eleven(ty).
By David Large (4 posts)
Eleventy 2.0 & WebC
I look at my experiences trying out Eleventy and its new Web Component language, webc.
By Martin Hicks (2 posts)
Pulling WordPress Content into Eleventy
Composable Architecture Powered by WordPress part 2 – How to pull content from a WordPress RESTful API into an Eleventy generated static site.
By Steven Woodson (6 posts)
Using Fontsource With 11ty
For quite some time, I was searching for a way to self host google fonts because the google fonts API's network request increased the render blocking time more than I expected.
By Murtuzaali Surti (5 posts)
Adding Download Support in an Eleventy Site
An example of adding download resources to an Eleventy site
By Raymond Camden (104 posts)
Letting Eleventy Schedule Its Own Builds
Until recently, I've been using GitHub Actions to trigger builds on my website, but this approach meant that builds for the site were only run once a day and that I couldn't schedule specific times for posts to go live. In February of this year, Netlify announced Scheduled Functions, and one
By Luke Bonaccorsi (3 posts)
Track data across builds in 11ty
New Eleventy features, a new theme, and full Eleventy support
We are announcing full CloudCannon support for Eleventy, one of the most popular (and fast) static site generators in the world.
By CloudCannon (7 posts)
Using Airtable as a Jamstack CMS
How I used Airtable as a content management system for a small portfolio website.
By Daniel Saunders (2 posts)
A new website: now on Eleventy!
Announcing the new version of my personal website - this time around I built it in Eleventy.
By Chip Cullen (2 posts)
Exploring WebC
How to setup and create your first WebC component in a Nunjucks 11ty
By Constant Vallee (2 posts)
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!
By Lene Saile (6 posts)
Eleventy asset pipeline: precompiled assets without Gulp
Precompiled Sass and JS files that become part of the source folder.
By Christopher Kirk-Nielsen (14 posts)
Relational data in Eleventy
CSS and JavaScript asย first-class citizens inย Eleventy
When building websites on Eleventy, we often have to decide how to deal with the CSS and JavaScript post-processing. Recently I came up with a solution, finally making CSS and JS first-class citizens in Eleventy for me.
By Vadim Makeev (1 post)
Building a YouTube Embed Web Component (both vanilla and WebC flavored)
A look at a simple YouTube embed component built in traditional web components and Eleventy's WebC plugin.
By Raymond Camden (104 posts)
Support External Articles in an Eleventy Blog
Adding a method to list external articles in an Eleventy blog
By Raymond Camden (104 posts)
Some Options for Timing Pages in Eleventy
Adding a Stripe cart to a static Eleventy website with LiveState: Part 1
We solve digital problems through custom software development and design for the webโapps, mobile, desktop and devices.
By Chris Nelson (1 post)
Quick LiquidJS + Eleventy Example - All Posts
Some quick things I learned about Liquid when building an "All Posts" page.
By Raymond Camden (104 posts)
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.
By Prabashwara Seneviratne (1 post)
Eleventy, Markdown, and Tailwind CSS
English software developer based in Seattle.
By Matthew Tole (1 post)
Why I use Eleventy
Ramblings about software development, privacy, and whatever happens to strike my fancy.
By Ryan Cao (3 posts)
Changing urls but keeping webmentions in Eleventy
Bernard Nijenhuis โข Front-end Developer โข Katwijk, The Netherlands โข Father of 3 kids โข Husband to 1 wife โข Owner of 2 cats
By Bernard Nijenhuis (8 posts)
Eleventy Starter Template Series
This series details how to build a starter template for Eleventy projects, going deep into architectural decisions and strategies to make it as easy as possible to start a new project.
By Dustin Whisman (5 posts)
Building an Eleventy Starter Template Series
In this series, learn how to construct your own starter template for Eleventy so you can start your future projects sooner.
By Dustin Whisman (5 posts)
My notes on Eleventy WebC components
WebC is a compiler for single file Web Components that brings first-class component model to Eleventy!
By Levi McGranahan (1 post)
Understanding WebC Features and Concepts
WebC is an exciting addition to the 11ty ecosystem as it enables first-class components. Putting the pieces together may be a little overwhelming, so letโs review some WebC features to help you be successful!
By Stephanie Eckles (21 posts)
WebC
WebC, the latest addition to the Eleventy suite of technologies, is focused on making Web Components easier to use.
By Fuzzy Logic (3 posts)
WebC
WebC, the latest addition to the Eleventy suite of technologies, is focused on making Web Components easier to use.
By Laurence Hughes (4 posts)
Why I built my own Vue plugin for Eleventy
Integrating Cloudinary into Eleventy
A look at integrating Cloudinary image processing with Eleventy
By Raymond Camden (104 posts)
First Experience Building with Eleventy's WebC Plugin
My first attempt working with Eleventy's new Web Component plugin
By Raymond Camden (104 posts)
Introduction to WebC
The next time you see me I will be Eleventy
Eleventy Tutorial - Create an 11ty Static Site
In this beginner's Eleventy tutorial, learn how to use 11ty by creating a static site with this Static Site Generator.
By Danial Zahid (6 posts)
Manage your SVG files with Eleventy's render plugin
Using renderFile to keep things tidy.
By Christopher Kirk-Nielsen (14 posts)
Getting set up in Eleventy (6 part series)
How I Learned to Stop Worrying and Love the Jamstack
How I came to build (a previous version of) this site on the Jamstack.
By Daniel Saunders (2 posts)
Shorter shortcuts through Nunjucks macros in Eleventy
While seeking a way to cut a three-line call down to one line, I found some great advice on using a sometimes-overlooked aspect of a popular templating language.
By Bryce Wray (26 posts)
Word count and reading time in Eleventy
Want to give your readers an idea of whatโs ahead? Hereโs some code to make that no biggie.
By Bryce Wray (26 posts)
Using Puppeteer with 11ty to automate generating social share images
Blog and general digital garden of the full stack programmer Simon Dann.
By Simon Dann (11 posts)
Learn the Eleventy Static Site Generator by Building and Deploying a Portfolio Website
What is Eleventy? Eleventy (also called 11ty) is a simple yet powerful static site generator. It uses JavaScript to transform data and templates into HTML pages. Itโs beginner-friendly, has fast build times, and generates fast sites by default. It al...
By Gerard Hynes (1 post)
11ty Serverless and Object Permalinks: Hybrid Rendering
Use a single source template in 11ty Serverless to generate both a static and server-rendered page.
By Aleksandr Hovhannisyan (14 posts)
Get good Git info from Eleventy, too
While per-page Git data is built into Hugo, a little code can bring it to Eleventy, as well.
By Bryce Wray (26 posts)
Walk with an Eleventy site, before you can run
A getting started guide with the bare minimum. Every time I open the documentation website of Eleventy , I get this urge to cry, or change career! So I decided to create a small website, that has absolutely nothing, but the bare minimum, and keep.... Posted in JavaScript, Hosting
By Amal Ayyash (1 post)
A truly fetching utility for Eleventy
While trying to make things work equally well in multiple repos, I discover the value of an Eleventy plugin Iโd previously ignored.
By Bryce Wray (26 posts)
Processing images linked from frontmatter with eleventy-img to use in meta tags
Static embeds in Eleventy
In what could and perhaps should be the end of this saga, hereโs code to provide static tweets and static Mastodon toots in Eleventy.
By Bryce Wray (26 posts)
Bringing your Notion database to life with Eleventy
How and why I combine Notion and Eleventy (11ty) to render my weekly feed stats on my website.
By Sam D King (1 post)
Webmention Setup for Eleventy
Hereโs a quick run-through of how I retrieve and use Webmentions with my Eleventy website.
By Chris Burnell (8 posts)
Eleventy within Eleventy to compile when you compile: precompiling reused assets
Pre-compile some reused assets to avoid repeating the same operation.
By Christopher Kirk-Nielsen (14 posts)
Adding Social Share Links in Eleventy
A quick example of adding social sharing links to your Eleventy site
By Raymond Camden (104 posts)
Eleventy: Build vs. Serverless vs. Edge
Nested navigation in Eleventy
11ty Second 11ty: Creating Template Filters
This week, weโre going to dive into 11ty filters. Weโll use 1 built-in filter, and make 2 custom filters.
By Bryan Robinson (15 posts)
Support Draft Blog Posts in Eleventy
A look at various ways of supporting draft posts with Eleventy
By Raymond Camden (104 posts)
We're all living on it. But what exactly is The Edge?
But what is The Edge? What are Edge Functions? And what impact does this new technology have on the Jamstack, the web, and ultimately โ people and our planet?
By Salma Alam-Naylor (1 post)
Using Eleventy transforms to render asynchronous content inside Nunjucks macros
11ty Second 11ty: Global Data files (JS and JSON)
In these two videos, we take 110 seconds each to discuss how to use 11ty's Global Data files to pull static data with JSON and dynamic (at build time) data with JavaScript.
By Bryan Robinson (15 posts)
WordPress & Eleventy part two: Eleventy
Some considerations for using WordPress as a headless content management system for Eleventy.
By Dana Byerly (8 posts)
WordPress & Eleventy part one: WordPress
Some considerations for setting up WordPress to use with Eleventy.
By Dana Byerly (8 posts)
6 Reasons I (Still) Love 11ty
Two years after launching my site with 11ty, itโs grown considerably, and yet Iโm still in love with the tool.
By Sean Davis (6 posts)
Add Netlify CMS to an existing 11ty site
Learn to add Netlify CMS to an existing 11ty site to make editing your posts easier
By Mike Street (13 posts)
Generating Zips in an Eleventy Site
An example of providing zipped resources in an Eleventy site.
By Raymond Camden (104 posts)
A New Schmidtynotes
Adding Custom Anchors to Headings in Markdown - Eleventy
Anchors are nothing but id attributes applied to an element to link to it using href attribute internally on the same page.
By Murtuzaali Surti (5 posts)
I18n of URLs
Zach Leatherman asked what style of internationalization you'd prefer (explicit or implicit) and my response just doesn't fit in 280 characters.
By Raphael Hรถser (4 posts)
Eleventy - Shortcode for Embedding Codepen
Don't know what eleventy is? Before you read further, check out this amazing series of articles by... Tagged with webdev, javascript, beginners, eleventy.
By Murtuzaali Surti (5 posts)
Reading Comic Books in the Jamstack
Adding support for digital comic books to your Jamstack site
By Raymond Camden (104 posts)
You should add a generator tag to your Eleventy site
Hear me out on this one, I've got a short but sensible list as to why.
By David Darnes (5 posts)
Testing the Netlify Cache Plugin with Eleventy
How I Doubled My Lighthouse Performance Score in One Night
I spent some time seeing if I could get my Lighthouse performance score up. Hereโs how I fared.
By Ben Myers (6 posts)
Related Content by Day of Year in Eleventy
A demonstration of how to get content published on the same day in the past.
By Raymond Camden (104 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)
Logging in Eleventy
How to use the debug package to output custom log messages alongside of Eleventyโs logs in your Eleventy build.
By Evan Sheehan (8 posts)
Building a Quiz with Eleventy and Eleventy Serverless
Getting Tailwind to work with Eleventy
Tackling Tailwind to work with Eleventy.
By Sami Mรครคttรค (6 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)
Static site delivery automation with Eleventy & Buddy
Combine the speed of Buddy and intuitive nature of Elevenly to build and deploy static sites lightning fast.
By Buddy (1 post)
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)
Why we switched to Eleventy + Netlify
From the minds at Chromatic: Expert opinions on Drupal, WordPress, software development, and business strategies.
By Chris Free (1 post)
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.
By Luciano Mammino (3 posts)
Add Build Info to an 11ty Site
Expose useful information about your Eleventy build to all of your templates using global data.
By Aleksandr Hovhannisyan (14 posts)
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)
Eleventy wont process post
Web development blog. The good, bad, and ugly (mostly bad and ugly)
By Joe Sahlsa (4 posts)
Automate syndication of your content with Eleventy, dev.to, and GitHub Actions
This started off as a test post for my talk I gave this past week at the Eleventy Meetup. Hereโs...
By Nick Taylor (2 posts)
Taming Eleventy Tags: Or How I Learned To Tolerate Double Pagination
Pagination in Eleventy is bit strange. Out of the box, Eleventy comes with support for something the developers call "pagination", but it...
By Desmond Rivet (1 post)
Creating a now page archive with 11ty
Blog and general digital garden of the full stack programmer Simon Dann.
By Simon Dann (11 posts)
Building a design system with Eleventy
How to use this flexible static site generator to create the home for digital design in your company
By Trys Mudford (2 posts)
Building a Serverless E-commerce Store with Stripe, Netlify, & 11ty
A lot of e-commerce solutions exist, but many of them charge a monthly fee. How could we build a site with the lowest hosting costs possible?
By Sia Karamalegos (13 posts)
A Set of Useful 11ty Filters
Extend Eleventyโs built-in filters with custom logic for these common use cases.
By Aleksandr Hovhannisyan (14 posts)
Favicons in root with Eleventy
A simple way to get any and all favicon variations in root for an Eleventy site.
By Den McHenry (1 post)
Hosting Eleventy on GitHub Pages
https://www.quinndombrowski.com/blog/2022/05/07/hosting-eleventy-on-github-pages/ I've really been enjoying building sites with Eleventy instead of Jekyll. I'm still learning my way around some of the cool data capabilities...
By Quinn Dombrowski (1 post)
From Notion to Eleventy part 2: Building Markdown from JSON
The ramblings of Ryan Boone, a web developer and designer from Texas with a passion for open, accessible front end development.
By Ryan Boone (3 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)
Post to Eleventy from iOS with Drafts, Shortcuts and Working Copy
A workflow to write and publish posts from iOS to an Eleventy blog using Drafts, Shortcuts, and Working Copy.
By Florian Eckerstorfer (9 posts)
Eleventy Related Posts Using TF-IDF
Automating related posts in Eleventy with term frequency-inverse document frequency and eleventy-plugin-related.
By Justin Poehnelt (2 posts)
Responsive Images in Markdown with Eleventy Image
I love markdown's simplicity and convenience, but sometimes you need a little more than the default image tag. In this post, I walk through how responsive images (with the picture tag) are handled on this blog in a way that doesn't compromise the authoring experience.
By Tomi Chen (1 post)
Use Your Saffron Recipes in the Jamstack
Using Storybook With 11ty
Storybook is great for component-driven development. This blog post shows you how to use Storybook with 11ty.
By Paul Everitt (2 posts)
Thoughts on the Jamstack and Content Metrics
Including RSS Content in your Eleventy Site - Part 2
A follow up to my post on using RSS data with Eleventy sites
By Raymond Camden (104 posts)
Some tricks for 11ty that I learned along the way
in this post I'll explain how to create a collection from a folder, how to use slugify in tags page, and how to create a page containing all tags ordered alphabetically
By Michele Nasti (1 post)
Eleventy Progressive Web App
Generating Apple Touch Icons with Eleventy
Creating the various sizes of Apple Touch Icons is one of the more tedious tasks in web development, but we can use JavaScript templates in Eleventy to automatically generate Apple Touch Icons.
By Florian Eckerstorfer (9 posts)
Migrating From WordPress to Eleventy - a non-developer's experience
I recently switched this website / blog from WordPress.com to Eleventy. I'm not a developer. Find out what happened!
By Popular history books (1 post)
Validating the HTML of an Eleventy site
Let's build an HTML validator for an Eleventy site. It will validate all generated pages to make sure they are valid HTML. Any errors will be reported in the terminal.
By Sandro Roth (2 posts)
Build a Blog With 11ty: Categories - Part 3
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.
By Jeremy Faucher (8 posts)
Build a Blog With 11ty: Base - Part 2
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.
By Jeremy Faucher (8 posts)
Build a Blog With 11ty: Setup - Part 1
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.
By Jeremy Faucher (8 posts)
Using Sanity CMS to host an image gallery for an existing 11ty site
Ignore Eleventy Files With Environment Variables
Using environment variables and the Eleventy config option to ignore files, we can exclude files or directories depending on our build process.
By Stephanie Eckles (21 posts)
Setting up Future Projects for Success with Template Repositories
This introduces the series of articles I wrote for Sparkbox's Foundry about how to build an Eleventy Starter Template.
By Dustin Whisman (5 posts)
Per-file commit logs with Eleventy
Using computed data and simple-git to generate file-specific changelogs.
By Max Kohler (2 posts)
Eleventy + Vue 3
Tips and tricks for using Vue 3 Single File Components as templates for Eleventy.
By Fynn Becker (3 posts)
11ty aliases the right way
A short little tutorial on how to make redirects in 11ty that aren't awful.
By Evan Boehs (2 posts)
11ty quick tip: Nunjucks include in markdown without indentation
If you're not careful, included files are not correctly rendered.
By Tim Kleyersburg (2 posts)
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.
By Rik Schennink (1 post)
Passing Object Arguments to Liquid Shortcodes in 11ty
Currently, 11ty doesnโt allow you to pass object arguments to shortcodes in Liquid. As a temporary workaround, you can assemble and parse a JSON string to pass along to the shortcode as an argument.
By Aleksandr Hovhannisyan (14 posts)
A 11ty Reading Time Plugin Quest
Blog and general digital garden of the full stack programmer Simon Dann.
By Simon Dann (11 posts)
Show off your Lighthouse scores as static HTML in Eleventy with the PageSpeed Insights API
The Eleventy community is often focused on performance in a way that you don't tend to see with other... Tagged with eleventy, 11ty, lighthouse, performance.
By Phil Wolstenholme (1 post)
Zero maintenance taxonomies in 11ty
Taxonomies in 11ty have always been hard. Sure, we have collections, but for when we want advanced features like categories and authors, it all falls apart. I found a solution. Introducing taxonomies that work so well they feel (almost) native!
By Evan Boehs (2 posts)
SEO-Friendly URLs With 11ty
One of the first things I do after starting a new WordPress project, is clean out unneeded code.
By Jeremy Faucher (8 posts)
Eleventy (11ty) setup for multilingual component-based flexible pages
By Andrea Berardi (1 post)
Building blocks for my first Eleventy site
Different choices that go into building an Eleventy website from scratch.
By Sami Mรครคttรค (6 posts)
Including RSS Content in your Eleventy Site
Custom Markdown Components in 11ty
Ever wanted to nest Markdown in HTML? In 11ty, you can easily do this with paired shortcodes and a custom Markdown parser.
By Aleksandr Hovhannisyan (14 posts)
Serverless blog with 11ty, GraphCMS and Firebase
The idea behind this experiment was to ignore modern practices: no Vercel and the complete React... Tagged with 11ty, eleventy, firebase, graphcms.
By Tim Vermaercke (1 post)
From Notion to Eleventy part 1: The Notion API
The ramblings of Ryan Boone, a web developer and designer from Texas with a passion for open, accessible front end development.
By Ryan Boone (3 posts)
Automating some of the publishing steps for my Eleventy blog
Heres how I automated some of the tedious steps of publishing new posts on my Eleventy blog.
By Michael Harley (14 posts)
Minimum Static Site Setup with Sass
Use this command line combination for building a static site that includes Browsersync, processing Sass and running the final files through autoprefixer and cssnano.
By Stephanie Eckles (21 posts)
How to add npm packages for client-side use in Eleventy
It's not immediately obvious how to use npm packages in an Eleventy website front end. Here's how to do it.
By Nicholas C. Zakas (2 posts)
New store for albertoballesteros.com: Eleventy and Snipcart
Snipcart is an e-commerce solution that allows us to add a shopping cart to a web page. This article describes how to do that with an Eleventy static site.
By Lene Saile (6 posts)
Adding QR Codes to Your Jamstack Site
Advanced 11ty: Using Objects in your UI
In this tutorial, we will be writing an async / await call and then returning its response (an... Tagged with 11ty, await, javascript, tutorial.
By Brewhouse Digital (3 posts)
Minifying JS in Eleventy on production
This tutorial is written for the 11ty framework and we will be hosting the app on Netlify. Other... Tagged with eleventy, minification, terser, 11ty.
By Brewhouse Digital (3 posts)
A Google Static Maps Eleventy Plugin
Migrating Hugo to Eleventy - Initial Thoughts
Migrating from Hugo to Eleventy has been a really pleasant and enjoyable experience.
By Bryan Lee (1 post)
Easily Create Gravatar Images With Eleventy
If you're moving your Wordpress site to Eleventy, you will want to convert your Gravatar images too. Find out how easy it is using an Eleventy shortcode.
By Marc Littlemore (4 posts)
My complete blogging workflow
Here is my complete blogging workflow from how I manage ideas all the way to publishing and sharing.
By Michael Harley (14 posts)
Using a Google Photos Album in your Eleventy Site with Pipedream
Integrating a Google Photos Album in your Eleventy site with Pipedream
By Raymond Camden (104 posts)
Fetching remote images with Eleventy
Following up on last monthโs article about doing this in Hugo, we explain how to get there in a JavaScript-based SSG.
By Bryce Wray (26 posts)
Nunjucks Conditional Statement Examples for Eleventy
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.
By Jeremy Faucher (8 posts)
Using Storybook with Nunjucks components in Eleventy
Say hello to obsolete29.com v4!
Eleventy came out with v1.0 so I rebuilt my site to celebrate.
By Michael Harley (14 posts)
Add Pagination to Your Eleventy Static Generated Website in Minutes
Learn how to add pagination to your Eleventy website for faster load times and better user experience with simple JavaScript.
By Nic Raboy (1 post)
A Guide to Building a Blog in Eleventy
A guide that walks folks through the process of building a blog with Eleventy
By Raymond Camden (104 posts)
Using the Netlify CMS locally
I have recently been building a few websites using Eleventy. This is a static site generator, built using Jamstack methodology.
By Trevor Morris (8 posts)
Eleventy Custom Content Type Collections and Layouts
How-to on creating separate collections and layouts for a custom content type. In this case: cocktails!
By Josh Cunningham (2 posts)
11ty tips I wish I knew from the start
Going all in with Jamstack and Eleventy
I rebuilt my personal site with Eleventy, a static site generator, and am loving it!
By Tim Kleyersburg (2 posts)