You can use arbitrary JavaScript in front matter in Eleventy project files (via the js type).
Historically Eleventy has made use of the node-retrieve-globals package to accomplish this, which was a nightmarish conglomeration of a few different Node.js approaches (each with ...
<line-numbers> is a web component to add line numbers alongside <pre> or <textarea> elements.
Demo
npm package
Install:
npm install @zachleat/line-numbers
Features
<pre> supported
<textarea> supported (even when adding or removing lines)
CS...
Working through the migration of Blog Awesome from WordPress to Eleventy, I encountered an interesting problem: each blog post was seeded with a featured image at the top, though the image did not cover the entirety of the header.
This required a manual process (a WordP...
The following code is a minimum viable custom element:
class Nimble extends HTMLElement {}
customElements.define("nim-ble", Nimble);
The define call is typically packaged up in the component code (for ease of use) and not in your application code. I typically adapt this int...
I was tagged to answer these questions by Anders Thoresson as part of the larger Blog Questions Challenge originally started by ava.
I’ll pass the baton (and a very optional tag to) to Lynn Fisher, Ryan Mulligan, and Sara Joy!
Here are some friends that have already particip...
Ready to geek out? In this episode of Podcast Awesome's Nerd Show and Tell, Matt sits down with none other than Zach Leatherman, the tech dynamo and creator behind Eleventy — the static site generator that’s got web devs buzzing. Zach’s tech-world experience is a wild ride ...
Here are the slides from my talk at Web Unleashed:
< PreviousNext >
Unfortunately the talk was not recorded (by the event or me) so you’ll have to ask questions about the slides if you want more context!
Panel Discussion
I was also honored to participate in a panel alongside Chris Coyier, Rachel Andrew, and Bekah Hawrot-Weigel:
Websites, are they still a good idea?
Related
My event page
Event page on fitc.ca
Full event photo album on Flickr
I’ve been laid off twice in the past year and a half trying to navigate my professional career through the moderate success that has followed 11ty. I don’t feel as though I’ve been particularly successful at it, to be frank. What I have felt is largely expendable.
I don’t bl...
<heading-anchors> adds sibling anchor links for heading elements (h1, h2, h3, h4, h5, h6) when they have an id attribute and positions those anchor links visually as though they were nested inside of the heading.
Demo
Source code on GitHub
Inspired by David Darnes’ c...
Up front disclosures: I am a former Netlify employee (it’s been over a year ago) and currently receive sponsored hosting services from both Vercel and Netlify.
If I’m completely frank, the 11ty Screenshots API has been a bit of a maintenance annoyance over the years: it’s a ...
The Eleventy code-base is now written using ESM.
However, Eleventy projects can be written using CommonJS or ESM (and we’ll continue to support both moving forward).
As Eleventy is a command line tool, this offers a bit of wiggle room navigating the CommonJS/ESM divide. That...
Over the years the Eleventy project has seen some things. One of the issues we’ve seen crop up a few times now involved the Quick Start guide, which had a few steps that asked folks to create a few new files in a Terminal application.
Notably, not everyone is familiar with T...
11ty creator Zach Leatherman is taking the open source site generator fully independent in 2024 and he’s back on the pod to tell us why, how & what we all can do to help.
I’ve been blown away by the response so far, y’all are amazing. At time of this post we’re currently at 56% of the goal.
(The above graph will update daily with the current status.)
The 11ty International Symposium on Making Web Sites Real Good wrapped up two short weeks ago and it was (to say the least) incredible. The speakers, the talks, and most importantly — the community.
Piggybacking from this amazing momentum, 11ty is making some bigger moves: w...
This talk was given at The 11ty International Symposium on Making Web Sites Real Good.
Watch on YouTube: The Future of 11ty (2024)
The rest of the amazing talks are also available on YouTube.
And the full slide deck is included below:
< PreviousNext >
This conference was an incredible privilege to help organize and selfishly I will say that one of my favorite parts was getting a big say in the talk selection.
They were all so good: Sia on Web Performance, Henry on the IndieWeb (I even saw Tantek and Aaron Parecki in the c...
Today my personal web site is being served sans-JavaScript in honor of JavaScript Naked Day.
I implemented this on my web site using a global JS_ENABLED in my Eleventy configuration file (propagated to templates via Eleventy’s global data). This removed the <script> el...
I was honored to be the very first guest to Glitch Jams Live! Glitch has always been a huge supporter of Eleventy—with a very prominent button to create an Eleventy Starter project on their home page.
With the recent migration of the Glitch Blog (via Keith Kurson on Mastodon...
The 11ty International Symposium on Making Web Sites Real Good (Conference) is approaching fast on May 9, 2024 and 947 folks have already signed up for the event!
To pair with the event, for the first time ever we’re offering a merch bundle for purchase. It’s conference swag, but only for people that want it! (Free shipping and a holographic sticker for Open Collective supporters)
This store will close April 5 to fulfill orders for the conference. The last day to order this bundle is April 5.
In this episode of the Mechanical Ink podcast, host Schalk Neethling sits down with Zach Leatherman, the creator of #11ty (among other open-source tools) in a conversation that spans the crucial aspects of web development.
They explore the intertwined relationship between w...
Subscribe
