Tutorials #

See all Eleventy blog posts on zachleat.com.

Series: Making a Simple Web Site with the Simplest Static Site Generator #

Level 1—Making Content with Data

Level 2—Adding Filters

Introduction #

Build an 11ty Site in 3 Minutes

Learn With Jason

Templating: Eleventy's Superpower

Learn Eleventy From Scratch

Beginner’s Guide to Eleventy

Itsiest, Bitsiest Eleventy Tutorial

A Site for Front-End Development Conferences (Built with 11ty on Netlify)

Turn Jekyll up to Eleventy

Getting Started with Eleventy

Video Series: Create an 11ty Theme from a free set of HTML templates

Eleventy Walk Through

Build a Blog #

eleventy-base-blog

• Source code
• Deploy to Netlify
• Try on StackBlitz

🎈 Official Starter · How to build a blog web site with Eleventy.

Creating A Blog With Eleventy

How I Create an Article Series in Eleventy

Build your own Blog from Scratch using Eleventy

Put it on the web #

• Create a new site from git on Netlify
• Deploying an 11ty Site to GitHub Pages byJonathan Snook
• Deploying an 11ty Site to GitLab Pages
• Make the Jump from Jekyll to JavaScript bySteve Stedman
• Deploying an 11ty Site to Azure Static Web Apps by Chad Schulz

Adding Features #

• Create Your Own Search without a Third Party Service byPhil Hawksworth
• Lightweight lazy loading with Netlify Large Media byPhil Hawksworth
• Multilingual sites with Eleventy (i18n, Internationalization) byJérôme Coupé
• Language switcher for multilingual JAMstack sites (i18n, Internationalization) byJérôme Coupé
• Adding Algolia Search to Eleventy and Netlify byRaymond Camden. (Also see part two)
• Eleventy and Cloudinary images (Setting up responsive images in Eleventy using Cloudinary) bySia Karamalegos
• Supporting Multiple Authors in an Eleventy Blog byRaymond Camden. (Also see part two)
• Accessing Eleventy Data on the Client Side byRaymond Camden
• Adding an Email Subscription to Your Jamstack Site byRaymond Camden
• Dynamic Short URLs with Eleventy byRaymond Camden

Using Third Party Data #

• Sample Project: Import your Notist events to an Eleventy site byPhil Hawksworth
• Sample Project: Import your Medium posts to an Eleventy site byPhil Hawksworth
• Import your Disqus Comments into Eleventy byZach Leatherman
• Static Indieweb pt1: Syndicating Content byMax Böck
• Static Indieweb pt2: Using Webmentions byMax Böck
• An In-Depth Tutorial of Webmentions + Eleventy bySia Karamalegos
• Using Eleventy to Generate a Ghost Blog byDavid Darnes
• Consuming a headless CMS GraphQL API with Eleventy byJérôme Coupé
• Import Tweets from Twitter API byDennis Hagemeier
• Convert a WordPress blog to Eleventy by Josh Cunningham
• Integrating Contentful with Eleventy to create static sites byShy Ruparel
• Creating an 11ty Photo Gallery with Contentful and GitHub actions byShy Ruparel
• Adding Google Calendar to your JAMStack byRaymond Camden
• Integrating Google Analytics with Eleventy byRaymond Camden
• Hooking Up FaunaDB to Eleventy byRaymond Camden
• Building a Database Driven Eleventy Site byRaymond Camden
• Integrating Eleventy with GitHub Flat Data byRaymond Camden

Tooling Integration #

• Using pHTML with Eleventy byJon Neal

Other pages in Getting Started:

• Command Line Usage
• Starter Projects
• Debugging
• Tutorials
• Quick Tips
• Programmatic API