11ty

Tutorials, plugins and tips for building static websites with 11ty (Eleventy), from collections and filters to deploying and scheduling posts.

There are 16 posts in the 11ty category.

Take your 11ty build from 1 second to 2 minutes by generating OG images
2023-02-16T00:00:00.000Z 16th February 2023

Take your 11ty build from 1 second to 2 minutes by generating OG images

I tried to generate OG images during build and it ended up taking a long time

11ty Node
Adding Tina CMS to 11ty
2023-01-14T00:00:00.000Z 14th January 2023

Adding Tina CMS to 11ty

Looking for a NetlifyCMS alternative to commit changes to the same repo, I stumbled upon TinaCMS

11ty CMS
Add Netlify CMS to an existing 11ty site
2022-07-29T00:00:00.000Z 29th July 2022

Add Netlify CMS to an existing 11ty site

Learn to add Netlify CMS to an existing 11ty site to make editing your posts easier

11ty Netlify
Upgrading 11ty from 0.12 to 1.0
2022-06-10T00:00:00.000Z 10th June 2022

Upgrading 11ty from 0.12 to 1.0

This blog has been running on 11ty for 2 years. With version 1.0 being released at the beginning of 2022, I thought it about time I upgraded

11ty
Making an 11ty collection from a remote XML file
2021-07-26T00:00:00.000Z 26th July 2021

Making an 11ty collection from a remote XML file

RSS is XML with a specification, however not all RSS feeds follow the spec. In this post, we process the feed as an XML document meaning we can access the extra attributes and values

RSS 11ty JavaScript
Create an 11ty collection from any RSS feed
2021-07-12T00:00:00.000Z 12th July 2021

Create an 11ty collection from any RSS feed

Using 11ty global data files, we create an 11ty collection from an RSS feed. As an example, we show the latest YouTube videos on our website

11ty JavaScript Video RSS
Creating an 11ty collection from a JSON API
2021-06-28T00:00:00.000Z 28th June 2021

Creating an 11ty collection from a JSON API

Using 11ty Global data files, you can make collections from JSON APIs, allowing you to make whole websites from one endpoint

JSON 11ty API
Building Ale House Rock with 11ty
2021-05-31T00:00:00.000Z 31st May 2021

Building Ale House Rock with 11ty

I rebuilt my beer review website using a JSON API and 11ty. This is a rundown of how I tackled it

11ty Cloudflare Projects
Accessing 11ty filters within data files to keep your code DRY
2021-05-17T00:00:00.000Z 17th May 2021

Accessing 11ty filters within data files to keep your code DRY

11ty filters can exist as JS functions inside the declared filters directory - these can be accessed by other files not processed by 11ty

11ty JavaScript
Get your Eleventy Site into the real world using a hosting provider like Netlify or Git pages
2021-04-19T00:00:00.000Z 19th April 2021

Get your Eleventy Site into the real world using a hosting provider like Netlify or Git pages

There are plenty of ways to get your 11ty site live depending on preferences and skill set, this blog walks through a few of the popular ones including Gitlab pages, Vercel, Netlify and Cloudflare pages

DevOps 11ty Netlify GitHub GitLab Cloudflare
11ty Utils - an NPM Package
2021-04-15T00:00:00.000Z 15th April 2021

11ty Utils - an NPM Package

I published an NPN package the other day which contains some everyday 11ty utils

11ty JavaScript NPM Projects
Build an 11ty calendar to list all your posts
2021-04-12T00:00:00.000Z 12th April 2021

Build an 11ty calendar to list all your posts

List all of your posts (or other collection items) in a calendar/diary format to give a timeline of your past

11ty JavaScript
Using Cloudflare workers to publish your scheduled 11ty posts
2021-04-05T00:00:00.000Z 5th April 2021

Using Cloudflare workers to publish your scheduled 11ty posts

Learn how to schedule blog posts and other items to go live with your static site generator without having to rebuild the whole site. Get all the benefits of a dynamic CSS with static files

JavaScript DevOps Netlify 11ty Cloudflare
Compiling your front-end assets with Laravel Mix while your 11ty site builds, so you don't have to switch between processes
2021-02-15T00:00:00.000Z 15th February 2021

Compiling your front-end assets with Laravel Mix while your 11ty site builds, so you don't have to switch between processes

Laravel Mix is a great asset compiler from the creators of Laravel - but you don't have to be using their framework to benefit from it. This blog walks through setting it up to run with 11ty.

Front-end Development 11ty Laravel
Converting Behind the Source to 11ty
2020-10-07T00:00:00.000Z 7th October 2020

Converting Behind the Source to 11ty

I spent the week converting Behind the Source from Craft to Eleventy (a static site generator). Will I use it again?

11ty Projects
Setting up Homebrew, NPM and Eleventy on a fresh mac
2020-10-05T00:00:00.000Z 5th October 2020

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.

Command Line Apple 11ty NPM