Skip to main content

Official 11ty docs

Layouts

Layouts — Eleventy

31 posts in 'Layouts'

Adding Image Galleries to My Website

At last, I've gotten around to implementing image galleries.

Dec 2, 2024

Categories: CollectionsFiltersImage GalleriesLayoutsPagination

Adding Cooklang Support to Eleventy Three Ways

How I added my recipes to my blog posts with cooklang and the recipe schema

Nov 7, 2024

Categories: CollectionsData CascadeFiltersFront MatterHow to...Layouts

Building a Blog with Eleventy (blind, any%)

I recently felt like getting back into blogging. But setting up and maintaining WordPress felt like more than I was looking for. I was looking for something much simpler. Preferably file-based and with Markdown support. That was my introduction to Eleventy.

Oct 19, 2024

Categories: BloggingCSS/SassCollectionsConfigurationData CascadeFiltersGetting StartedGlobal DataLayoutsMarkdownNavigationPaginationPluginsShortcodes

Integrating a (somewhat) custom CMS with Eleventy

I've spent the last, uh, month or so inching my way towards leveraging a CMS to manage the content on this site. It started with improving my self-hosted scrobbling setup, importing yet more of my personal data and then looking around at friendlier options to manage what I'd spun up.

Jun 3, 2024

Categories: CMSCollectionsLayoutsRemote Data

Getting started with Eleventy

The missing getting-started guide for the Eleventy (11ty) static-site generator.

May 27, 2024

Categories: Asset PipelinesConfigurationGetting StartedLayoutsShortcodes

Dynamic Content Includes

In this post, I explain how I solved two issues at the same time by introducing a feature to my post layout that I’m calling pre and post includes.

May 24, 2024

Categories: Front MatterHow to...LayoutsNunjucks/Macros

Better 11ty Development with Tooling

Getting a component-driven development experience that fits nicely into the 11ty zen.

Apr 21, 2024

Categories: Getting StartedLayoutsYouTube

How I Eleventy

Documenting a refactor that introduced a folder structure and configuration changes, which summarises how I Eleventy.

Mar 13, 2024

Categories: ConfigurationHow to...LayoutsMarkdownPermalinksShortcodes

Eleventy - Fetch data from the Github REST API to populate a projects page

We will populate a page with data from GitHub. We will use the eleventy-fetch plugin to do this with minimal code and refresh the data every 2 days.

Feb 7, 2024

Categories: FiltersGlobal DataLayoutsRemote Data

Top 11 free Eleventy themes for 2024

A curated list of the top 11 Eleventy themes on GitHub in 2024.

Jan 30, 2024

Categories: ConfigurationGetting StartedLayouts

Low-tech Eleventy Categories

Eleventy has built-in tagging and collections capabilities that I’m riffing on to show you how to build a super simple category system with RSS feeds for each one.

Jan 26, 2024

Categories: CollectionsConfigurationHow to...LayoutsPagination

Eleventy - Create a global production flag

A production flag enables you to run activites in production only e.g. minifying assets. There isn't a built-in flag in eleventy. How can we add one?

Jan 24, 2024

Categories: ConfigurationGlobal DataHow to...Layouts

Getting up to Speed with Eleventy: Config and Collections

Continuing his Eleventy tutorial, David Eastman shows how to configure the system, make use of templates, what collections are, and more.

Jan 20, 2024

Categories: CollectionsConfigurationLayouts

How I used JPEGs as templates in Eleventy to build a photo gallery

Jan 5, 2024

Categories: ConfigurationHow to...ImagesLayoutsImage Galleries

Generating and Caching Open Graph Images with Eleventy

How I'm caching my open graph images with eleventy-plugin-og-image instead of generating them on every build

Dec 24, 2023

Categories: ConfigurationHow to...ImagesLayoutsSocial Media

Generating a static blog with Eleventy

From 0 to minimal blog using 11ty. I tell you the steps I took to create the minimal technical basis for this website's content.

Dec 23, 2023

Categories: BloggingCollectionsConfigurationInternationalizationLayouts

Default layouts in 11ty

Default layouts in 11ty

Nov 6, 2023

Categories: ConfigurationHow to...Layouts

Making a simple Eleventy blog template

If you’ve worked with TypeScript, React or Next odds are you’ve encountered an update that broke a... Tagged with frontend, css, html, tutorial.

Oct 3, 2023

Categories: BloggingCollectionsFront MatterHow to...Layouts

CAUTION

The posts below were published before the release of Eleventy v2.0.0 (Feb 8, 2023). Information in these posts may be out of date. The current stable release is 2.0.1. Eleventy v3.0 is currently under development and available for testing.

Eleventy Layouts with Sizlate

Eleventy Layouts with Sizlate by Simon McManus

Nov 6, 2022

Categories: Layouts

Creating a now page archive with 11ty

Blog and general digital garden of the full stack programmer Simon Dann.

May 17, 2022

Categories: CollectionsFront MatterHow to...LayoutsNavigationNow Page

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.

Mar 28, 2022

Categories: BloggingGetting StartedHow to...Layouts

CAUTION

The posts below were published before the release of Eleventy v1.0.0 (Jan 9, 2022). Information in these posts may be out of date. The current stable release is 2.0.1. Eleventy v3.0 is currently under development and available for testing.

Eleventy Custom Content Type Collections and Layouts

How-to on creating separate collections and layouts for a custom content type. In this case: cocktails!

Jan 4, 2022

Categories: CollectionsLayouts

How to use Vue to template your Eleventy projects

If you like using Eleventy, but would love to leverage Vue syntax in your templates, here's a guide on how to do that.

Dec 1, 2021

Categories: Layouts

Using Liquid Blocks in Eleventy Layouts

A look at using multiple blocks and having them render in Liquid templates

Aug 19, 2021

Categories: LayoutsHow to...

Eleventy and template extends

A quirk detail about how Elevent handles extending a Nunjucks layout using template blocks.

Jul 23, 2021

Categories: Layouts

RSS, a love letter and walkthrough for my Eleventy site

Power Platform Developer and all around cool guy

Dec 31, 2020

Categories: How to...PluginsLayoutsRSS

Building a website with a static site generator, part 2: Eleventy

In this post, we're gonna take a deeper look into Eleventy which takes care of building the website by combining layout templates with blog post data from Markdown files.

Mar 18, 2020

Categories: Getting StartedGlobal DataLayoutsBlogging

Get the blog by email (or RSS)

Powered by Buttondown