Using Goodreads Data in Eleventy – Update / / No Comments Yesterday I shared a blog post where I detailed how to take your data export from Goodreads and make use of it in an Eleventy site. While describing the process, I mentioned that I wasn’t terribly confident in the approach. Things got even worse when I tried to make use of the Google Books API as well. (That’s not the fault of the API, more just an issue with how Goodreads reported book titles.) Well, today, Brian Koser reached out and pointed out a much easier way to accomplish the same thing. To be honest, I love it when I say something and folks point out a way to make it better – it’s like free content for my blog! Anyway, here’s what Brian shared. Turns out,... more → Posted in: JavaScript Tagged with: data, Eleventy, Goodreads, update, using
Working with CloudCannon and Eleventy – My Experience / / No Comments I’ve been working with the Jamstack (in its various iterations and names) for many years now. In that time, one area I had not really looked into is the use of a content management system (CMS). I recently had a chance to look into how CloudCannon adds CMS capabilities to Eleventy and I thought I’d share my experience. I went in, admittedly, a bit concerned. One of Eleventy’s greatest strengths is its flexibility. Unlike other Jamstack solutions that have a proscribed way of doing things, Eleventy is incredibly open to how it can be used to build a site. My assumption was that it would be difficult for a CMS to "grok" a particular Eleventy implementation and support... more → Posted in: JavaScript Tagged with: CloudCannon, Eleventy, Experience, working
Supporting PDF Embeds in an Eleventy WebC Component / / No Comments Way back in the old days, in August of 2021, I wrote up an example of adding support for Adobe’s PDF Embed API as an Eleventy plugin: "An Adobe PDF Embed Plugin for Eleventy". When I find time, I need to update that to the newest URL for the library, but more recently I was curious if I could recreate support using the WebC template language. While it was a bit difficult at times (and a big thank you goes to Zach for patiently helping me), I think it’s at a point now where it can be shared. I will warn folks that I’m still struggling a bit with the best way to work with WebC, and at least one feature I’m showing isn’t documented yet (but I’ve confirmed... more → Posted in: JavaScript Tagged with: Component, Eleventy, Embeds, Supporting, WebC
Update to My Eleventy Blog Guide / / No Comments Last January, I announced the release of a guide I had written for building a simple blog in Eleventy. Now that Eleventy has hit 2.0, I took some time this morning to look at the guide and see what could be updated. The first thing I noticed was that I had a heck of a lot of typos. I fixed those. I then went through the two main versions of the blog (before and after UI was added) and updated the dependencies to the 2.0 release of Eleventy. That being said, I didn’t do anything else. This is not to say that the 2.0 release wasn’t lacking in new features, but as my guide is meant to be as simple as possible, I wasn’t on the lookout to add any new features if it didn’t make... more → Posted in: JavaScript Tagged with: blog, Eleventy, Guide, update
Adding Download Support in an Eleventy Site / / No Comments I was thinking recently about how I would add "Downloads" support to an Eleventy site. By that I mean, a site where you have various resources (PDFs, zip, etc) and want to provide a way to let users download them in a consistent manner, as well as how basic tracking could be done as well. I came up with a few ideas I’d like to share, but as always, please let me know what you’ve done and what you would suggest. Method 1 – Meta Refresh For my first attempt, I imagined a site where I’ve got some files up in S3 (like I do for my images here) and I’d like to take a directory and set them up as resources. So for example, imagine a _data file named downloads.json: {... more → Posted in: JavaScript Tagged with: Adding, download, Eleventy, Site, Support
A Bare-Bones Eleventy Template for Glitch / / No Comments A few weeks ago I blogged about a simple Alpine.js template for Glitch projects. I’m still new to Glitch and wanted to give it a whirl with an Eleventy demo I wanted to share. Glitch has an Eleventy template, but it’s a bit verbose. It sets up a basic blog with sample posts and such, and that’s great to learn, but if you already know Eleventy, you may prefer to start off a bit simpler. With that in mind, I created this repository: https://github.com/cfjedimaster/glitch-eleventy It defines an .eleventy.js file that specifies an input and output directory. It sets up a very basic HTML layout and an empty index page that uses it. I also used Liquid for my demo whereas the Glitch-provided... more → Posted in: JavaScript Tagged with: BareBones, Eleventy, Glitch, Template
Quick LiquidJS + Eleventy Example – All Posts / / No Comments So, on a whim today I decided to add a page to my blog to display every single post, separated by year. This was not meant to be used by anyone (hence me not linking to it in the nav), but something I’ve wanted around for a while. I’ve got a nice search form here, but sometimes I want to search for something I blogged a few weeks ago and having a simple list of posts would be useful. I didn’t want to build "proper" pagination, just one giant list in on an HTML page. That’s not the best UX but as I’m building this for me, I approve. I thought it would be a quick little script, but as I built it, I ran into a few interesting... more → Posted in: JavaScript Tagged with: Eleventy, example, LiquidJS, posts, Quick
Integrating Cloudinary into Eleventy / / No Comments I’ve had on my "to-do" list for months now to take a look at Cloudinary and their media APIs. I got some time this week to play around with it and I wanted to share my experience. TLDR – it’s freaking incredibly well done and surprisingly powerful. Here’s what I found. Raymond Camden… more → Posted in: JavaScript Tagged with: Cloudinary, Eleventy, Integrating, into