#Eleventy

14 post14 partecipanti0 post oggi

Frontend DogmaEleventy: A GitHub Workflow to Check if an Automated Dependency Update Would Break Your Site, by <a href="https://mas.to/@j9t" class="u-url mention" rel="nofollow noopener noreferrer" target="_blank">@j9t</a> [<a href="https://mas.to/@frontenddogma" class="u-url mention" rel="nofollow noopener noreferrer" target="_blank">@frontenddogma</a>]:<a href="https://meiert.com/en/blog/eleventy-github-workflow/" rel="nofollow noopener noreferrer" translate="no" target="_blank">https://meiert.com/en/blog/eleventy-github-workflow/</a><a href="https://mas.to/tags/eleventy" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#eleventy</a> <a href="https://mas.to/tags/dependencies" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#dependencies</a> <a href="https://mas.to/tags/nodejs" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#nodejs</a> <a href="https://mas.to/tags/automation" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#automation</a> <a href="https://mas.to/tags/githubactions" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#githubactions</a>

Nicolas Hoizey<a href="https://front-end.social/@matuzo" class="u-url mention" rel="nofollow noopener noreferrer" target="_blank">@matuzo</a> I have a really simple `caniuse` shortcode for <a href="https://mamot.fr/tags/Eleventy" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#Eleventy</a> :<a href="https://github.com/nhoizey/nicolas-hoizey.com/blob/main/src/_11ty/shortcodes/caniuse.js" rel="nofollow noopener noreferrer" translate="no" target="_blank">https://github.com/nhoizey/nicolas-hoizey.com/blob/main/src/_11ty/shortcodes/caniuse.js</a>It’s using <a href="https://front-end.social/@ire" class="u-url mention" rel="nofollow noopener noreferrer" target="_blank">@ire</a> ‘s CanIUse Embed: <a href="https://caniuse.bitsofco.de/" rel="nofollow noopener noreferrer" translate="no" target="_blank">https://caniuse.bitsofco.de/</a>For example: - Markdown: <a href="https://github.com/nhoizey/nicolas-hoizey.com/blob/main/src/notes/2023/02/05/1/index.md" rel="nofollow noopener noreferrer" translate="no" target="_blank">https://github.com/nhoizey/nicolas-hoizey.com/blob/main/src/notes/2023/02/05/1/index.md</a> - Result: <a href="https://nicolas-hoizey.com/notes/2023/02/05/1/" rel="nofollow noopener noreferrer" translate="no" target="_blank">https://nicolas-hoizey.com/notes/2023/02/05/1/</a>

Cory Dransfeldt :demi:🔗 Magick images. via <a href="https://follow.ethanmarcotte.com/@beep" class="u-url mention" rel="nofollow noopener noreferrer" target="_blank">@beep</a> <a href="https://follow.coryd.dev/tags/Development" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#Development</a> <a href="https://follow.coryd.dev/tags/Webdev" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#Webdev</a> <a href="https://follow.coryd.dev/tags/Eleventy" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#Eleventy</a>Since leaving 18F, I’ve spent much of the last month thinking about what’s next for me work-wise. And of course, I’ve been doing no small amount of doomscrolling. But amid all of that, I’ve been remembering how to treat my website like a worry stone. When things get too stressful I’ll spend some time sanding down a few rough edges in the redesign. A...<a href="https://ethanmarcotte.com/wrote/magick-images/" rel="nofollow noopener noreferrer" translate="no" target="_blank">https://ethanmarcotte.com/wrote/magick-images/</a>

Robert Kingett11tyCMS: First design & file management <a href="https://thinkymeat.neocities.org/posts/11tycms-redesign/" rel="nofollow noopener noreferrer" translate="no" target="_blank">https://thinkymeat.neocities.org/posts/11tycms-redesign/</a> <a href="https://caneandable.social/tags/11ty" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#11ty</a> <a href="https://caneandable.social/tags/Eleventy" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#Eleventy</a> <a href="https://caneandable.social/tags/CMS" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#CMS</a>

Christopher Kirk-NielsenDouble pagination in <a href="https://front-end.social/tags/eleventy" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#eleventy</a>? Yes, we can! And given it's a fun challenge, I wrote about it here: <a href="https://chriskirknielsen.com/blog/double-pagination-in-eleventy/" rel="nofollow noopener noreferrer" translate="no" target="_blank">https://chriskirknielsen.com/blog/double-pagination-in-eleventy/</a> Also yes my entire sense of humour is memes, why do you ask? <a href="https://front-end.social/tags/11ty" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#11ty</a>

JuhisI documented my flow and tooling for how I write and publish blog posts right now.I use <a href="https://mastodon.world/tags/Notion" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#Notion</a> as my CMS and <a href="https://mastodon.world/tags/Eleventy" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#Eleventy</a> (❤️) as my static site generator and I've written custom CLI tools with Node to integrate the two.My tooling has been built one small piece at a time over the past 7 years.<a href="https://hamatti.org/posts/how-i-write-and-publish-blog-posts-in-april-2025/" rel="nofollow noopener noreferrer" translate="no" target="_blank">https://hamatti.org/posts/how-i-write-and-publish-blog-posts-in-april-2025/</a><a href="https://mastodon.world/tags/blogging" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#blogging</a> <a href="https://mastodon.world/tags/11ty" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#11ty</a> <a href="https://mastodon.world/tags/IndieWeb" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#IndieWeb</a>

Ryan RobinsonThis is what vacation weeks are for, apparently: I made a little bit of progress on my <a href="https://mstdn.ca/tags/eleventy" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#eleventy</a> personal blog sites. There are still some issues and certainly lots of room to improve the styles, but I crossed off a couple things from the TODO list.

Marijke LuttekesThe Eleventy data cascade is great: You can have data on different “layers", for example, applying to an entire directory via JS or one file via Front Matter. Eleventy merges these layers for you, including objects mapping to the same key.I just created a map of string replacements for permalinks over different layers.One central function uses the merged map to modify permalinks accordingly.This is fancy stuff. I hope to write a detailed How-To in the future.<a href="https://fosstodon.org/tags/Eleventy" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#Eleventy</a> <a href="https://fosstodon.org/tags/11ty" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#11ty</a>

Ted Flynn 👽GitHub told me that the auto deploying action for my silly blog would be disabled if there weren't any code changes. It's not every day that I get called out by my own infrastructure so rudely, so now you have to hear about it, too. Posting for the sake of posting. Seems about right.<a href="https://beige.party/tags/Eleventy" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#Eleventy</a> <a href="https://beige.party/tags/WebDev" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#WebDev</a> <a href="https://beige.party/tags/McLuhan" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#McLuhan</a> 🔗 <a href="https://frgmnt.art/posts/infrastucture-shaming/" rel="nofollow noopener noreferrer" translate="no" target="_blank">https://frgmnt.art/posts/infrastucture-shaming/</a>

Stefan FredeI promised a friend that I would rebuild his site so that I could have a project to play with with Eleventy, but I spent far too much time trying to get everything to my liking. I wanted to run Eleventy with Docker, use custom elements, either with WebC or native, and build on some projects I really like. I think I did that, and I really like it, but now I have no excuse anymore not to start rebuilding my friend's website.<a href="https://mastodon.social/tags/eleventy" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#eleventy</a> <a href="https://mastodon.social/tags/11ty" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#11ty</a>

stefan bJust wrote a new blog post, "Adding base64 placeholder background images to eleventy-img"In which I add base64-encoded placeholder background images to <img> tags on my Eleventy site, automagically, to reduce Layout Shift and make the site feel super snappy<a href="https://blog.chobble.com/blog/25-04-16-adding-base64-image-backgrounds-to-eleventy-img/" rel="nofollow noopener noreferrer" translate="no" target="_blank">https://blog.chobble.com/blog/25-04-16-adding-base64-image-backgrounds-to-eleventy-img/</a><a href="https://social.lol/tags/11ty" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#11ty</a> <a href="https://social.lol/tags/Eleventy" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#Eleventy</a> <a href="https://social.lol/tags/webdev" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#webdev</a>

Robert KingettYAY! My <a href="https://caneandable.social/tags/Python" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#Python</a> is improving! I made this thing that makes a new <a href="https://fosstodon.org/@eleventy" class="u-url mention" rel="nofollow noopener noreferrer" target="_blank">@eleventy</a> for me based off templates. Any chance Eleventy will have a built in new post creation thing in the future? I know it makes absolutely zero assumptions about your project but this is the most time consuming part for me and I imagine I'm not alone in this thinking. <a href="https://github.com/rkingett/myblog/blob/main/MakeNewPost.py" rel="nofollow noopener noreferrer" translate="no" target="_blank">https://github.com/rkingett/myblog/blob/main/MakeNewPost.py</a> <a href="https://caneandable.social/tags/Eleventy" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#Eleventy</a> <a href="https://caneandable.social/tags/11ty" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#11ty</a> <a href="https://caneandable.social/tags/WebDev" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#WebDev</a>

Reilly Spitzfaden (they/them)I've had a statuslog section on my now page (<a href="https://reillyspitzfaden.com/now/" rel="nofollow noopener noreferrer" translate="no" target="_blank">https://reillyspitzfaden.com/now/</a>) for a while, and I added it to my homepage as well (<a href="https://reillyspitzfaden.com/#homepageStatus" rel="nofollow noopener noreferrer" translate="no" target="_blank">https://reillyspitzfaden.com/#homepageStatus</a>).The especially nice part is that I now have a script (<a href="https://github.com/reillypascal/personalsite-ssg/blob/main/status" rel="nofollow noopener noreferrer" translate="no" target="_blank">https://github.com/reillypascal/personalsite-ssg/blob/main/status</a>) so I can simply type `./status` in the terminal, write the status text in the resulting .md file that pops open, and then commit/push!I've seen some IndieWeb people (e.g., <a href="https://social.lol/@binarydigit" class="u-url mention" rel="nofollow noopener noreferrer" target="_blank">@binarydigit</a>) do something similar via one of omg.lol's tools (<a href="https://home.omg.lol/info/statuslog" rel="nofollow noopener noreferrer" translate="no" target="_blank">https://home.omg.lol/info/statuslog</a>) and liked it, but I wanted to see if I could DIY it just for the heck of it. Very happy with how easy the result is!<a href="https://hachyderm.io/tags/IndieWeb" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#IndieWeb</a> <a href="https://hachyderm.io/tags/Eleventy" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#Eleventy</a> <a href="https://hachyderm.io/tags/11ty" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#11ty</a> <a href="https://hachyderm.io/tags/WebDev" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#WebDev</a> <a href="https://hachyderm.io/tags/Coding" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#Coding</a> <a href="https://hachyderm.io/tags/Programming" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#Programming</a> <a href="https://hachyderm.io/tags/HTML" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#HTML</a> <a href="https://hachyderm.io/tags/CSS" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#CSS</a> <a href="https://hachyderm.io/tags/Markdown" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#Markdown</a>

Trevor BurrowsSo, super simple Eleventy + Obsidian recipe for a <a href="https://techhub.social/tags/DigitalGarden" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#DigitalGarden</a> space:* Set up an 11ty project * install the eleventy-plugin-interlinker (link below) * open the project folder in Obsidian * create a notes folder and change your settings so that all new notes go to that folder * Add the Backlinks code from the interlinker plugin's readme into either an Obsidian template or a 11ty layout * Add to that template some frontmatter for title, date * Start making notes. Serve locally (from terminal, vscodium,, whatever). The interlinker plugin is here: <a href="https://github.com/photogabble/eleventy-plugin-interlinker" rel="nofollow noopener noreferrer" translate="no" target="_blank">https://github.com/photogabble/eleventy-plugin-interlinker</a><a href="https://techhub.social/tags/11ty" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#11ty</a> <a href="https://techhub.social/tags/Eleventy" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#Eleventy</a>

tlohdeWrote myself a how-to (or rather a "how did I?") for adding <a href="https://fediscience.org/tags/leaflet" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#leaflet</a> maps to my <a href="https://fediscience.org/tags/11ty" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#11ty</a> site.<a href="https://tlohde.com/blog/2025/04/mapping-with-leaflet/" rel="nofollow noopener noreferrer" translate="no" target="_blank">https://tlohde.com/blog/2025/04/mapping-with-leaflet/</a><a href="https://fediscience.org/tags/WebMapping" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#WebMapping</a> <a href="https://fediscience.org/tags/eleventy" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#eleventy</a> <a href="https://fediscience.org/tags/indieweb" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#indieweb</a>

Reilly Spitzfaden (they/them)I found this cool option to keep a post as a draft in my Eleventy site: <a href="https://www.11ty.dev/docs/config-preprocessors/#example-drafts" rel="nofollow noopener noreferrer" translate="no" target="_blank">https://www.11ty.dev/docs/config-preprocessors/#example-drafts</a>I'd been wanting a way to view posts on a local dev server, but leave them out of my published site, and now all I have to do is add `draft: true` to the YAML frontmatter on a post and then it won't publish except on a dev server. Nice!<a href="https://hachyderm.io/tags/Eleventy" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#Eleventy</a> <a href="https://hachyderm.io/tags/11ty" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#11ty</a> <a href="https://hachyderm.io/tags/WebDev" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#WebDev</a> <a href="https://hachyderm.io/tags/Blogging" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#Blogging</a>

PhilipI've finished writing up the details on how I added search to my 11ty site without client-side Javascript after the upgrade to 11ty version 3 removed the official serverless function.<a href="https://www.philiprenich.com/blog/recreating-search-with-eleventy-v3-and-netlify/" rel="nofollow noopener noreferrer" translate="no" target="_blank">https://www.philiprenich.com/blog/recreating-search-with-eleventy-v3-and-netlify/</a>Big thanks to Zach for jumping in with some answers when I couldn't read the manual correctly 😅 (and, ya know, creating Eleventy!)<a href="https://mastodon.nz/tags/WebDev" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#WebDev</a> <a href="https://mastodon.nz/tags/Eleventy" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#Eleventy</a> <a href="https://mastodon.nz/tags/11ty" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#11ty</a>

Klaas Pieter AnnemaI rewrote <a href="https://annema.me" rel="nofollow noopener noreferrer" translate="no" target="_blank">https://annema.me</a> using <a href="https://mastodon.design/tags/eleventy" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#eleventy</a> in preparation of restarting my blog. It's almost identical to the plain HTML site I had but I feel the setup is cleaner. For example:1. less repeated HTML: for the previous iteration I copied the entire base layout to every HTML file 2. CSS inspired by Cube CSS (<a href="https://cube.fyi" rel="nofollow noopener noreferrer" translate="no" target="_blank">https://cube.fyi</a>): One of the reasons for the rewrite was learning more modern web development 3. Perfect Lighthouse score <a href="https://pagespeed.web.dev/analysis/https-annema-me/5ymwes6t7e?form_factor=mobile" rel="nofollow noopener noreferrer" translate="no" target="_blank">https://pagespeed.web.dev/analysis/https-annema-me/5ymwes6t7e?form_factor=mobile</a>Feedback appreciated.

famebot🌈📓 <a href="https://mastodon.social/tags/eleventeen" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#eleventeen</a> 9.4 hits the scene like a <a href="https://mastodon.social/tags/rainbow" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#rainbow</a> machine on the latest <a href="https://mastodon.social/tags/eleventy" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#eleventy</a> at last 🎈🐀 <a href="https://eleventeen.blog/about/" rel="nofollow noopener noreferrer" translate="no" target="_blank">https://eleventeen.blog/about/</a>don’t sleep on all <a href="https://indieweb.social/@bobmonsour" class="u-url mention" rel="nofollow noopener noreferrer" target="_blank">@bobmonsour</a>’s other great hand-picked options to kickstart your <a href="https://mastodon.social/tags/11ty" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#11ty</a> journey at <a href="https://11tybundle.dev/starters/" rel="nofollow noopener noreferrer" translate="no" target="_blank">https://11tybundle.dev/starters/</a> either❣️

HexaèdreAfter reading a post by <a href="https://mastodon.social/@troz" class="u-url mention" rel="nofollow noopener noreferrer" target="_blank">@troz</a> I decided to try <a href="https://fosstodon.org/@eleventy" class="u-url mention" rel="nofollow noopener noreferrer" target="_blank">@eleventy</a> for my site. The thing that resonated with me was the "black box" feeling I had with my previous setup. It was a fun journey! It’s been some time since I did CSS and JavaScript… My responsive code still needs work, but I’ll improve it.<a href="https://hexaedre.com/hexa01/" rel="nofollow noopener noreferrer" translate="no" target="_blank">https://hexaedre.com/hexa01/</a><a href="https://dice.camp/tags/eleventy" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#eleventy</a>

Ricerche recenti

Opzioni di ricerca

Amministrato da:

Statistiche del server: