# Jekyll Published articles for Jekyll. This is one page of public article previews, not the complete archive. Follow Next page to continue. Summaries are not the original full articles. ## Rewrote my blog with Zine DevFeed: [Rewrote my blog with Zine]() Original publisher: [Read original article]() Author: April Published: 2026-04-19T00:00:00Z Content type: article Language: en Sources: [Drew DeVault]() Topics: [Website](), [Hugo](), [Jekyll](), [Open Source]() Tags: [blog](), [blog-post](), [github-pages](), [hugo](), [jekyll](), [open-source](), [open-source-software](), [static-site-generator]() ### AI overview The author describes rewriting their blog from Hugo to Zine after frustrations with Hugo's complexity and backwards-incompatible changes. They also discuss porting nearly 400 archived posts and exploring Zine's SuperHTML and SuperMD tools. ### Source excerpt 15 years ago, on December 11th, 2010, at the bold age of 17, I wrote my first blog post on the wonders of the Windows Phone 7 on Blogspot. I started blogging as a kid at the behest of a family friend at Microsoft, who promised she'd make sure I would become the youngest Microsoft MVP if I started blogging. That never came to pass, though, because as I entered adulthood and started to grow independent of my Microsoft-friendly family I quickly began down the path to the free and open source software community. Early blog posts covered intriguing topics such as complaining about my parent's internet filter, a horrible hack to "replace" the battery of a dead gameboy game, announcing my friend's Minecraft guild had a new website (in PHP), and so on. After Blogspot, I moved to Jekyll on GitHub pages, publishing You don't need jQuery in 2013. For a long time this was the oldest post on the site. I'm pretty proud of my writing skills and have a solid grasp on who I am today, but the further back you go the worse my writing, ideas, values, and politics all get. I was growing up in front of the world on this blog, you know? It's pretty embarassing to keep all of this old stuff around. But, I decided a long time ago to keep all of it up, so that people can understand where I've come from, and that everyone has to start somewhere.1 At some point - I'm not sure when - I switched from Jekyll to Hugo, and I've stuck with it since. But lately I've been frustrated with it. I'd like my blog engine to remain relatively stable and simple, but Hugo is quite complex and over the past few years I've been bitten by a number of annoying and backwards-incompatible changes. And, as part of my efforts to remove vibe-coded software from my stack, I was disappointed to learn that Hugo is being vibe coded now, and so rewriting my blog went onto the todo list. Choosing the right static site generator (SSG) was a bit of a frustrating process. Other leading candidates, like Pelican or Zola, are also ## How I Made $360 by Serving Markdown to A.I. agents from My Jekyll Blog DevFeed: [How I Made $360 by Serving Markdown to A.I. agents from My Jekyll Blog]() Original publisher: [Read original article]() Author: Daniel Doubrovkine (dblock@dblock.org) Published: 2026-04-11T00:00:00Z Content type: opinion Language: en Sources: [Daniel Doubrovkine]() Topics: [Jekyll](), [Markdown]() Tags: [ai](), [blogging](), [jekyll](), [markdown](), [tech]() ### AI overview The author describes adding clean Markdown versions of Jekyll blog posts so AI agents can fetch them instead of parsing HTML. Thirty days later, a linked Monarch referral produced 18 signups, 12 paid conversions, and $360 in referral earnings, with no change in SEO traffic. ### Source excerpt In April 2025 I wrote Apologizing for My Obsessiveness Over Punctuation, a post about my various organizational compulsions. Near the end, almost as an aside, I mentioned that I obsessively categorize expenses in Monarch, a personal finance app, linking it with my referral code. That post earned me exactly one referral in the nine months that followed. Then, on January 15th, 2026, I wrote Serving Markdown for AI Agents. The idea is simple: for every post on this blog, there's now a .md version at the same URL. AI agents can discover and fetch clean markdown instead of parsing HTML. I didn't think much of it. Exactly thirty days later - the length of Monarch's free trial -- I started getting a stream of referral conversion notifications without any change in SEO traffic. Eighteen signups. Twelve converted to paid. At $30/referral, that's $360. We live in the future. How I Made $360 by Serving Markdown to A.I. agents from My Jekyll Blog was originally published by Daniel Doubrovkine at code.dblock.org | tech blog on April 11, 2026. ## Adding a CMS to My Astro Blog (and the OAuth Rabbit Hole That Followed) DevFeed: [Adding a CMS to My Astro Blog (and the OAuth Rabbit Hole That Followed)]() Original publisher: [Read original article]() Published: 2026-03-24T00:00:00Z Content type: tutorial Language: en Sources: [Alex Korbonits]() Topics: [Astro](), [Content Management System](), [OAuth](), [Netlify](), [GitHub](), [debugging](), [migration](), [Jekyll]() Tags: [astro](), [authentication](), [cms](), [config](), [debugging](), [github](), [jekyll](), [markdown](), [migration](), [netlify](), [oauth]() ### AI overview The author adds Decap CMS to a static Astro blog so Markdown content stored in GitHub can be edited through a browser. The article explains the OAuth relay setup and finds that Netlify's relay rejected the site because its domain was not recognized; adding the domain as a custom domain fixed the issue. ### Source excerpt How I added Decap CMS to my static Astro site, and the authentication debugging that followed. ## Migrating an 11-Year-Old Blog from Jekyll to Astro with Kiro DevFeed: [Migrating an 11-Year-Old Blog from Jekyll to Astro with Kiro]() Original publisher: [Read original article]() Published: 2026-03-17T00:00:00Z Content type: opinion Language: en Sources: [Alex Korbonits]() Topics: [migration](), [Astro](), [Jekyll](), [Kiro](), [Claude](), [Artificial Intelligence](), [ide]() Tags: [ai](), [astro](), [blog](), [claude](), [commands](), [ide](), [jekyll](), [kiro](), [migration]() ### AI overview The author describes migrating an 11-year-old blog from Jekyll to Astro in one evening with help from Kiro and Claude. Kiro read the existing Jekyll files, generated Astro components, fixed build errors, and iterated on the redesign. ### Source excerpt A year ago this would have taken a week. How I migrated an 11-year-old Jekyll blog to Astro in one evening with two toddlers in the house. ## Serving Markdown for AI Agents in Jekyll DevFeed: [Serving Markdown for AI Agents in Jekyll]() Original publisher: [Read original article]() Author: Daniel Doubrovkine (dblock@dblock.org) Published: 2026-01-15T00:00:00Z Content type: tutorial Language: en Sources: [Daniel Doubrovkine]() Topics: [Jekyll](), [Markdown](), [Artificial Intelligence](), [GitHub Actions](), [GitHub]() Tags: [agents](), [ai](), [ai-agents](), [deployment](), [github-actions](), [jekyll](), [markdown]() ### AI overview The article explains how a Jekyll blog on GitHub Pages serves each post's source Markdown alongside its HTML so AI agents can access cleaner, structured content. A GitHub Actions workflow copies the Markdown files to matching .md URLs and adds an alternate link in the HTML head for discovery. ### Source excerpt Dries Buytaert recently wrote about The Third Audience. For decades, websites have targeted two audiences: humans and search engines. AI agents are now the third audience, and most websites aren't optimized for them yet. AI agents prefer clean, structured content over HTML. Markdown is ideal - it's readable, semantic, and free of navigation chrome. So I made this blog serve its source markdown files alongside the HTML. How It Works For every post like /2026/01/15/serving-markdown-for-ai-agents.html, you can now fetch the source at /2026/01/15/serving-markdown-for-ai-agents.md. AI agents can discover this via a tag in the HTML head: Implementation Since this is a GitHub Pages blog, custom Jekyll plugins don't work. Instead, I added a GitHub Actions workflow that builds Jekyll and copies the markdown source files to _site before deployment. The workflow extracts the date and slug from each post filename and copies it to the matching URL path with a .md extension. Should You Do This? Dries raises a valid concern: are we just making it easier for AI companies to use our content without sending traffic back? Perhaps. But AI agents are already crawling our sites. Giving them cleaner input might lead to better attribution and more accurate responses that reference our work. The web has always been about making information accessible. This is just the next evolution. Plus, we will soon all work for AI anyway, so might as well get on its good side. Meta This entire feature was implemented by Claude, and this post was written by it as well. Added GitHub Actions workflow to deploy and serve markdown. Use Ruby 3.4 in deploy workflow. Also serve page markdown files. Added link rel alternate for markdown discovery. Moved markdown link to post layout. Fixed markdown alternate URL to remove .html. Serving Markdown for AI Agents. Serving Markdown for AI Agents in Jekyll was o ## Backup Buddy: A Simple Tool to Backup Your Website Content DevFeed: [Backup Buddy: A Simple Tool to Backup Your Website Content]() Original publisher: [Read original article]() Author: Dean Hume Published: 2025-12-01T12:33:06Z Content type: tutorial Language: en Sources: [Dean Hume]() Topics: [Tool](), [Website](), [Markdown](), [Command-line interface](), [HTML](), [static-site-generator](), [Git](), [Hugo](), [Jekyll]() Tags: [backup](), [command-line](), [export](), [git](), [how-to](), [hugo](), [jekyll](), [offline](), [portable](), [release](), [static-site-generator](), [tool](), [website]() ### AI overview Backup Buddy is a command-line tool that backs up website content by using a sitemap to download pages, convert HTML to Markdown, and save images and videos locally. The article explains its use for offline reading, migration, search, sharing, and Git version control. ### Source excerpt Have you ever wanted to create a backup of your website or blog? Maybe you're migrating to a new platform, or perhaps you just want a portable archive of your content that you can read offline. I've previously experienced issues with this site going down and ## Hybrid Frameworks Can Serve Static and Server-Rendered Pages DevFeed: [Hybrid Frameworks Can Serve Static and Server-Rendered Pages]() Original publisher: [Read original article]() Published: 2025-05-08T00:00:00Z Content type: opinion Language: en Sources: [Dan Abramov]() Topics: [Framework](), [React](), [Astro](), [Cloudflare](), [Hugo](), [Jekyll]() Tags: [cdn](), [cloudflare](), [flexibility](), [fragmentation](), [hosting](), [hugo](), [jekyll](), [static]() ### AI overview The article argues that hybrid frameworks, which support both server and static output, can reduce tooling fragmentation and give developers more flexibility. It explains that static pages can be generated by running a server framework during the build process and storing the resulting responses. ### Source excerpt You wouldn't download a site. ## Why I Created a Personal Blog and Chose Zola with GitHub Pages DevFeed: [Why I Created a Personal Blog and Chose Zola with GitHub Pages]() Original publisher: [Read original article]() Author: Stanko Published: 2025-01-18T00:00:00Z Content type: opinion Language: en Sources: [Stanko Tadić]() Topics: [Jekyll](), [GitHub Pages](), [Website](), [static-site-generator](), [hosting](), [Programming](), [GitHub](), [WordPress]() Tags: [blog](), [github](), [github-pages](), [hosting](), [jekyll](), [programming](), [static-site-generator](), [website](), [wordpress]() ### AI overview The author explains why they created a personal blog, describing it as a way to maintain a personal website and share programming projects outside social networks. They discuss moving from Jekyll to Zola, keeping the site on GitHub Pages, and their interest in eventually building a static site generator with interactive posts and JSX. ### Source excerpt I've seen this challenge on Herman's blog. I liked it, so I decided to do my own version, even though I'm not using the bear blog. For the same reason, I slightly adapted the original questions. Why did you make the blog in the first place? # Since I first got online, I've wanted a personal website - a piece of internet I can call my own. I had a few websites over the years, but none of them are online anymore (and I don't have backups). Then, in my late twenties, I decided to try again. As someone who loves programming and making things, I've gathered plenty of material to share over the years. I also wanted to change the fact that I hadn't written much since high school. I've never been a fan of social networks, so starting a blog felt like the perfect thing for me -- I could have my own website and share the things I'm working on. This blog has been up since 2016, and I'm really proud of it. While the frequency of my posts has gone down, I like to think the quality has gone up. Why did you choose Bearblog Zola and GitHub Pages? # Before Zola, I used Jekyll, which is tightly coupled with GitHub Pages. GitHub Pages restricts you to the default Jekyll configuration, so I couldn't customize all the stuff I wanted. I started looking for a replacement and stumbled on Zola. It seemed very nice -- fast, a single binary, with a sane templating language. After trying it, I really liked it and decided to stick with it. I kept it deployed on GitHub Pages because I think they're great. Free and fast hosting, and the fact that I don't have to mess with deployments myself -- thanks, GitHub folks! However, for a long time now, I've wanted to write my own small static site generator. It would support interactive posts/components and use JSXI think that JSX is a great templating language. If I ever do it, I'll open-source it. Have you blogged on other platforms before? # As mentioned above, this blog used to be a Jekyll blog. Before that, I tried keeping a blog a few times, but only ## How to automatically add WebP post banners to Jekyll for faster load times DevFeed: [How to automatically add WebP post banners to Jekyll for faster load times]() Original publisher: [Read original article]() Author: Jake Lee Published: 2024-11-30T00:00:00Z Content type: tutorial Language: en Sources: [Jake Lee's Programming Blog]() Topics: [Jekyll](), [Web Development](), [Accessibility](), [browsers](), [CSS]() Tags: [accessibility](), [how-to](), [images](), [jekyll](), [liquid](), [optimisation](), [times]() ### AI overview A tutorial on automating WebP banner generation and delivery in Jekyll. It explains configuring a conversion library, generating WebP files, serving them conditionally with Liquid and picture/source elements, and providing alternative text. The article also notes possible color-rendering issues with the converter. ### Source excerpt Most modern browsers can handle the smaller & speedier WebP versions of images, yet generating them manually can be a pain! Here's how to do it automatically in Jekyll. ## Website refresh DevFeed: [Website refresh]() Original publisher: [Read original article]() Author: info@jeroenmols.com (Jeroen Mols) Published: 2024-09-20T00:00:00Z Content type: opinion Language: en Sources: [Jeroen Mols]() Topics: [Website](), [Hugo](), [Jekyll](), [Web Development](), [modern web development](), [Netlify](), [Vercel]() Tags: [blogging](), [blogs](), [development](), [hugo](), [jekyll](), [migrate](), [netlify](), [platform](), [redesign](), [static-site-generator](), [vercel](), [web-development](), [website](), [website-refresh]() ### AI overview A personal account of migrating a seven-year-old Jekyll website to Hugo. It explains the old site's deployment setup and limitations, the motivations for the redesign, and the author's evaluation of static-site generators and hosting options. ### Source excerpt After 7 years, it was time to migrate my old Jekyll website to a new more modern platform. Read on to learn why, how, and what the main challenges were in this process. ## 2022.5 in Review DevFeed: [2022.5 in Review]() Original publisher: [Read original article]() Published: 2023-07-05T00:00:00Z Content type: article Language: en Sources: [Una Kravets]() Topics: [devrel](), [CSS](), [Web Development](), [Tooling](), [Gulp](), [Jekyll]() Tags: [jekyll](), [less](), [personal](), [podcast](), [retrospective](), [tooling](), [web](), [year-in-review]() ### AI overview A delayed retrospective on 2022 covering personal highlights, a new personal website, growth of the Web UI and Tooling DevRel team, and content production. It also discusses the CSS Podcast's third season, which focused on new and upcoming CSS APIs. ### Source excerpt Catching up on last year's year-in-review post ## Switching from Disqus to Giscus (GitHub Discussions) DevFeed: [Switching from Disqus to Giscus (GitHub Discussions)]() Original publisher: [Read original article]() Author: brice.dutheil@gmail.com (Brice Dutheil) Published: 2022-10-16T15:08:53Z Content type: tutorial Language: en Sources: [The Coffee Workshop]() Topics: [Giscus](), [GitHub](), [migration](), [Hugo](), [Jekyll](), [WordPress]() Tags: [blog](), [github](), [how-to](), [hugo](), [interface](), [jekyll](), [markdown](), [switching]() ### AI overview This tutorial describes migrating a blog's comments from Disqus to GitHub Discussions using Giscus. It explains the motivations for the migration, the basic Giscus setup, repository requirements, and discussion category configuration. ### Source excerpt In the story of this blog I used WordPress, and using the WordPress comments then moved to Discus as it was better at handling spam. Then I switched this blog to GitHub with first Jekyll with markdown then finally to Hugo, this worked well enough. Then lately I've been a bit more displeased by the Disqus editing capability (no markdown (or asciidoc) support, no preview). More people tend to have a GitHub account than a Disqus account (for tech blogs). Also, GitHub introduced GitHub Discussions which was appealing to use with blogs. ## Announcing Docusaurus 2.0 DevFeed: [Announcing Docusaurus 2.0]() Original publisher: [Read original article]() Author: Joel Marcey Published: 2022-08-01T00:00:00Z Content type: release Language: en Sources: [Docusaurus Blog]() Topics: [Documentation](), [static-site-generator](), [Markdown](), [React](), [Meta](), [Jekyll]() Tags: [announce](), [documentation](), [javascript](), [jekyll](), [markdown](), [open-source](), [react](), [release]() ### AI overview Meta Open Source announces Docusaurus 2.0, a static site generator for building documentation websites from Markdown. The release includes documentation and blog layouts, versioning, search, internationalization, accessibility, search engine optimization, flexible theming, and React-based client-side navigation. ### Source excerpt Today we are extremely happy to finally announce Docusaurus 2.0! 🥳 ## Meet Jekyll - The Static Site Generator DevFeed: [Meet Jekyll - The Static Site Generator]() Original publisher: [Read original article]() Author: Techno Tim Published: 2022-05-28T15:00:00Z Content type: tutorial Language: en Sources: [Techno Tim]() Topics: [Jekyll](), [GitHub Actions](), [Markdown](), [Docker Compose](), [Open Source]() Tags: [docker](), [git](), [github-actions](), [github-pages](), [jekyll](), [markdown](), [open-source](), [self-hosted](), [static-site-generator]() ### AI overview A practical tutorial on building a Jekyll documentation site with the Chirpy theme. It covers installation and configuration, Markdown pages, GitHub Actions builds, GitHub Pages hosting, self-hosting, Docker, production builds, and post formatting. ### Source excerpt Jekyll is a static site generator that transforms your plain text into beautiful static web sites and blogs.It can be use for a documentation site, a blog, an event site, or really any web site you like. It's fast, secure, easy, and open source.It's also the same site generator I use to maintain my open source documentation.Today, we'll be installing and configuring Jekyll using the Chirpy them... ## Introducing Henry for Hugo DevFeed: [Introducing Henry for Hugo]() Original publisher: [Read original article]() Author: Kaushik Gopal Published: 2021-10-17T21:14:04Z Content type: article Language: en Sources: [Kaushik Gopal's Site]() Topics: [Hugo](), [Jekyll](), [Go Language](), [CSS]() Tags: [blog-post](), [go](), [hugo](), [jekyll](), [scss](), [vscode]() ### AI overview The author introduces Henry, a customizable Hugo theme recreated from an earlier Jekyll version. The article describes its Hugo-based features, including SCSS customization, responsive footnotes, image shortcodes, and a VSCode snippet. ### Source excerpt Henry is a theme I first open-sourced for Jekyll. You can read all about it here. I've now recreated Henry for Hugo. Why Hugo? ## Over the last year, I've been learning Go and my interest in Hugo piqued. Hugo -- much like Jekyll -- is a static blog engine written in Go. But it's got more features, a more active community and is blazingly fast. Features # Many of the features I wrote as custom features for Jekyll, come built-in with Hugo. But I took the opportunity to tweak these a little further. Here's how they're implemented in Hugo: Customizability ## A blog theme is only useful if it is versatile enough to reflect your unique character and touch. Henry is extremely customizable. With simple scss override files you can customize the entire look of your blog. If you look at the main style.scss file in Henry, here's how we import the different styles: // themes/henry/assets/scss/style.scss @import "theme"; @import "mixins", "code", "base"; @import "main"; You can override any of the above files and customize your blog's look. For example, to change the background color you can override the theme.scss file like so: // my-blog/assets/scss/theme.scss @import '../../themes/henry/assets/scss/theme'; // Hook to override predefined variables. $color-background: #3E4244; $color-header-index: lighten($color-background, 10%); $color-header: lighten($color-background, 60%); To see a demo of the difference compare this blog with my brother's. Both use Henry but look pretty different. FootSidenotes ## I picked this feature up from Tufte CSS1 - inspired by the legendary Edward Tufte. If you're reading this post on a wide screen you should notice the tips to the side of this post. Go ahead and hover your cursor over to see the sidenote highlighted. On narrower screens (like phones) the sidenotes show up as traditional footnotes. You can use the quick jump links to navigate back and forth. You can read more about this feature and its implementation in this separate blog post. Image ## Using Google Forms for Jekyll Comments, Revisited DevFeed: [Using Google Forms for Jekyll Comments, Revisited]() Original publisher: [Read original article]() Author: JD Porterfield (jd.porterfield@alumni.rice.edu) Published: 2021-09-25T00:00:00Z Content type: tutorial Language: en Sources: [JD Porterfield | Articles]() Topics: [Jekyll](), [Forms](), [implementation](), [Code](), [GitHub]() Tags: [article](), [code](), [forms](), [free](), [github](), [guide](), [how-to](), [implementation](), [jekyll](), [update]() ### AI overview An updated guide to using Google Forms for comments on Jekyll sites. It describes changes to the original implementation, provides upgrade guidance, and introduces a dedicated GitHub project with labeled releases for maintaining the code. ### Source excerpt Displaying comments on your blog for free using Google Forms is now even easier! ## Testing Code Tabs DevFeed: [Testing Code Tabs]() Original publisher: [Read original article]() Author: JD Porterfield (jd.porterfield@alumni.rice.edu) Published: 2021-09-12T00:00:00Z Content type: tutorial Language: en Sources: [JD Porterfield | Articles]() Topics: [Jekyll](), [Markdown](), [CSS](), [Code]() Tags: [code](), [css](), [jekyll](), [markdown](), [plugin]() ### AI overview This article demonstrates the jdvp-codetabs-commonmark Jekyll plugin, which adds tabbed code blocks for showing multiple language snippets. It also describes optional code-copying controls and light/dark mode switching within code blocks. ### Source excerpt Testing the jdvp-codetabs-commonmark plugin's functionality ## I redesigned my site DevFeed: [I redesigned my site]() Original publisher: [Read original article]() Author: Monica Dinculescu Published: 2021-06-24T00:00:00Z Content type: opinion Language: en Sources: [Monica Dinculescu]() Topics: [Website](), [generative art](), [Web Components](), [HTML](), [JavaScript](), [Jekyll](), [GitHub Pages]() Tags: [components](), [generative-art](), [github-pages](), [html](), [ibm](), [javascript](), [jekyll]() ### AI overview The author explains why they redesigned their personal website: they were publishing fewer blog posts, wanted to showcase generative art, and replaced an outdated emoji custom element with a simpler implementation. The site continues to use Jekyll through GitHub Pages without a build step or minification. ### Source excerpt The last time I changed something big on my site was 3+ years ago. I was really into gradient rainbow text and IBM Plex Mono. It was a mild increment over whatever I had before, which was just a cleaned up and colourful version of Left from like 6 years prior. Anyway, what I'm saying is: this website had hella split ends. Here's the before and after: ↓ But also, why? I used to write a lot of blog posts, so my website was very blog focused. Originally the home page was just a listing of posts with some copy sprinkled in. As the pandemic hit, I started writing fewer and fewer posts, so having the one post of 2020 show up as a listing was ridiculous. On top of that, this year I started focusing a lot more on making generative art and I thought it was sad I wasn't showing that anywhere on the site! The beauty of generative art is that you can just keep generating it over and over again, and my site was a long white column of text. No more! git diff Ok so hear me out, this looks bad and that's because: it is bad. One cute thing my old site had was a custom element. You pressed it and got a rain of emoji. Brilliant. The problem is that I wrote that in like 2017, and used the well deceased v0 version of the web components spec. As a result, it had a gazillion dependencies (rip bower_components) and polyfills and ancient trash. 23906 lines of trash to be exact. Gooood riddance. The added 1580 lines are a bit of a bore: 100 of these are this post. another 300 is the HTML Ipsum from CSS tricks because I'm always scared I'm going to break a style on some ancient post. 300 lines of JavaScript for the header art that I don't minify because I'd like to be able to read this in the future to fix whatever mistakes past Monica made, and I don't have a build step set up. I'm still using the Jekyll that comes out of the box with GitHub pages and I am never looking back. the rest is actual code that I touched! There was some really horrifying markup on the project/talks/tem ## Introducing Henry for Jekyll DevFeed: [Introducing Henry for Jekyll]() Original publisher: [Read original article]() Author: Kaushik Gopal Published: 2021-03-20T07:00:00Z Content type: release Language: en Sources: [Kaushik Gopal's Site]() Topics: [Jekyll](), [CSS](), [HTML](), [Web Development]() Tags: [announce](), [blog-post](), [css](), [features](), [html](), [implementation](), [jekyll](), [open-source]() ### AI overview The article announces Henry, a free and open-source Jekyll theme. It describes customization through override files, footsidenotes, image display options, related-post links based on tags, and external URLs with commentary. ### Source excerpt Henry is a theme I first open-sourced for Jekyll. I've now recreated Henry for Hugo after migrated this blog to Hugo. You can read about it here. I've used Jekyll as my blog engine here and meticulously tweaked it over the years to support a bunch of features. Many folks have asked me if I would ever put my theme up for sale or distribute it more widely. I'm happy to announce that it's now available for free and open source. Introducing Henry - a Jekyll theme with a gorgeous reading experience, chock-full of features. Features # Customizability ## A blog theme is only useful if it is versatile enough to reflect your unique character and touch. Henry is extremely customizable. With simple scss override files you can customize the entire look of your blog. I've made sure the overrides get layered in, on top of Henry's base CSS making it easy to quickly add your own customizations. Take a look: Your browser doesn't support HTML5 video. Download the video instead. To see a demo of the difference, compare this blog (what you're currently reading) with my brother's. Both use Henry. You can push the boundaries by adding independent pages and nifty scripting. Take a look at this sample portfolio page I've started building for my brother's blog.1 FootSidenotes ## I picked this feature up from Tufte CSS2 - inspired by the legendary Edward Tufte. If you're reading this post on a wide screen you should notice the sidenote tips above. Go ahead and hover your cursor over it to see the sidenote highlighted. If you're on a narrower screen (or phone) the sidenote morphs into a traditional footnote with quick jump links. You can read more about this feature and its implementation in this blog post. Image display ## With Henry, you can display images in a variety of ways. Or use HTML directly with customized css tags: // Added this to my main_override.scss file .tac { margin: 0 auto } Courtesy: lawsofux ## Week 1: A personal update on returning to Magenta and rebuilding a Jekyll site DevFeed: [Week 1: A personal update on returning to Magenta and rebuilding a Jekyll site]() Original publisher: [Read original article]() Author: Monica Dinculescu Published: 2021-01-04T00:00:00Z Content type: opinion Language: en Sources: [Monica Dinculescu]() Topics: [Development](), [Jekyll](), [GitHub](), [Code]() Tags: [code](), [development](), [github](), [jekyll]() ### AI overview A personal weekly update about rebuilding a Jekyll site with roughly 40 GitHub commits, returning to Magenta after a fellowship with the Trevor Project, and leading a team that classified suicidal ideation. The author also discusses broth, television, Animal Crossing, and returning to piano. ### Source excerpt I've been thinking for a while about setting this up, and this week seems as good as any. Both Alice and Frances have weekly updates that are a joy to read. Jenn has a live laugh blog. Maybe this is the year of long form tweets? I haven't touched my site in like 6+ months so when I tried to run jekyll locally it obviously didn't work, so what you're reading took like 40 commits on GitHub. In work news, I'm coming back to Magenta after 6 months of being a fellow with the Trevor project. I lead a team that worked on classifying suicidal ideation for one of their projects. The work was super interesting (though often sad), and in a shocking development i really enjoyed being a team lead. I think that even though I'm really good at writing actual code, I'm also good at herding cats and holding a lot of statuses and details in my head. I was worried at the beginning of the fellowship that TLs don't write any code and I would suddenly become a meeting chair, and even though I did have a ton of meetings, I also wrote a ton of code. I know it's weird to hear a woman assert things she's good at it. This is also a new thing I'm trying out. My notes, my rules! In personal news, I've gotten really into broth-as-a-savoury-afternoon tea. I used to make a lot of miso (and drink it out of a cup; this part is key), but to add some variety in my life, this week I started boiling a bunch of vegetables during meetings and making my own broth. Anything for variety in the apocalypse, amirite. Goldie moved in to my Animal Crossing island. I am exclusively watching serial killer shows right now (Des, I'll be gone in the dark, Ripper) which isn't exactly off brand but might be a little TOO on brand, you know? That's what I get for finishing Bridgerton in 2 days. For my birthday in November my mum got me some new books of piano sheet music, so I've started playing some piano again. Before I moved to America, I used to play every day and be actually good at it, but much like with everything e ## 2020 Recap: Projects, Blog Changes, Mechanical Keyboards, and TV DevFeed: [2020 Recap: Projects, Blog Changes, Mechanical Keyboards, and TV]() Original publisher: [Read original article]() Author: Kaushik Gopal Published: 2021-01-01T07:00:00Z Content type: opinion Language: en Sources: [Kaushik Gopal's Site]() Topics: [Jekyll](), [CSS](), [User experience (UX)](), [Web Development](), [Hacking]() Tags: [apple](), [blog](), [css](), [hacking](), [jekyll](), [ux]() ### AI overview A personal 2020 recap covering slower development of Fragmented, a domain move and customizations to the author's blog, a CSS refactor and minimal Jekyll podcast theme, mechanical keyboard experiments, and increased television viewing. ### Source excerpt From my 2020 post: 2019 has been the year that's primed me the most for life changes. I imagine 2020 will the be the one where a lot of these changes materialize. ... that's cute. If you're reading this in the future and suprised why, I suggest this Netflix mockumentary. Contagion style blazing dumpster fire year aside, it's been hard to find the motivation to write this post. But reading my previous years' posts, I'm usually grateful past me took the time to capture my thinking, priorities and general frame of reference. So power on, I shall. 2020 Recap: # Fragmented ## Fragmented remains my proudest labor of love but I'm not kidding about the labor part of this statement. We're taking it much slower on Fragmented releasing as and when, our lives allow us. But with 2021 rolling around, the hope is that we can kick things back up atleast from the current dormancy. Stay tuned. jkl.gg ## Lot of changes here. I moved my primary domain and assets from kaush.co1 to jkl.gg. This blog saw a lot of tweaks and customizations. The joke goes: most people with custom blog setups spend more time customizing their blog than writing posts. This was true for me but I actually enjoy the process of customizing my blog. In addition to (pleasantly) reminding me of my WebDev days, it also helps me learn and understand my UX skills better. Posts like the one I wrote on sidenotes2 come from this process. Another change that was probably not evident was the entire CSS refactor of this blog. A lot of display:grid is now being used. No post on this but in the process of this refactor, I've actually started work on a minimal jekyll theme for podcasts .3 Mechanical keyboards and hacking ## Productivity has always been a theme for this blog. This year I played (and spent) a lot with Mechanical Keyboards. It was a fun experiment, learning to flash and customize keyboards. Eventually settled with tricking out existing apple keyboards with karabiner and goku. Lot of TV ## I watched a lot of TV. This ## Jekyll & GitHub Actions DevFeed: [Jekyll & GitHub Actions]() Original publisher: [Read original article]() Author: JD Porterfield (jd.porterfield@alumni.rice.edu) Published: 2020-11-07T00:00:00Z Content type: tutorial Language: en Sources: [JD Porterfield | Articles]() Topics: [GitHub Pages](), [Jekyll](), [GitHub Actions](), [GitHub]() Tags: [github](), [github-actions](), [github-pages](), [jekyll]() ### AI overview This tutorial explains the limitations of deploying Jekyll sites directly through GitHub Pages, including its restricted support for Jekyll plugins and gem versions. It presents GitHub Actions as a way to build the site automatically on commits and publish the generated content. ### Source excerpt The standard GitHub Pages process imposes limitations on which Jekyll plugins we can use. Let's avoid this issue using GitHub Actions instead. ## Jekyll footnotes as Edward Tufte inspired sidenotes DevFeed: [Jekyll footnotes as Edward Tufte inspired sidenotes]() Original publisher: [Read original article]() Author: Kaushik Gopal Published: 2020-07-21T07:00:00Z Content type: tutorial Language: en Sources: [Kaushik Gopal's Site]() Topics: [Jekyll](), [CSS](), [JavaScript](), [jQuery](), [Web Development]() Tags: [browser](), [code](), [css](), [javascript](), [jekyll]() ### AI overview The article explains how to implement Tufte-inspired sidenotes in a Jekyll blog by adapting kramdown footnotes. It uses JavaScript and jQuery to position notes in the page margin and discusses handling image loading and browser resizing. ### Source excerpt I've been looking into Tufte CSS recently. Tufte CSS -inspired by the teachings of the legendary Edward Tufte1- provides suggestions and tools to style web articles for improved legibility. I've started to incorporate some of those principles here while still trying to keep the authenticity of my original design. Most of these changes have been in the realm of CSS however the sidenotes feature was a slightly trickier beast. I've implemented this feature in my blog theme "Henry" for both Hugo & Jekyll. Jekyll kramdown comes built in with a footnotes feature that I've used here for some time. It works pretty well for the most part. The only problem though is -as the names suggests- it displays the notes all the way at the bottom of the articles near the footer. Your browser doesn't support HTML5 video. Download the video instead. Edward Tufte instead suggests the use of "sidenotes": Sidenotes are like footnotes, except they don't force the reader to jump their eye to the bottom of the page, but instead display off to the side in the margin. So my objective was to use the existing kramdown pipes and generate the footnotes, but display them off to the side in the margin instead of at the bottom. Pulling this off is tricky with pure CSS but is baby talk for javascript. So I pulled out my trusty old jQuery2 chops and got this fun side project done. source You can find the js source code here. As is the case with these things though, the devil is in the details. I got the basic functionality down in about an hour but adding the finishing touches took more testing and improving. Here's some of the ones I had to tackle: Image loading throws the position off: ## Since jQuery loads eagerly, it typically wouldn't wait for the images to load before calculating the position. This would cause the position to be off sometimes. Your browser doesn't support HTML5 video. Download the video instead. This is a one-line fix in jQuery: $(window).on("load", function() { // executes after e ## Migrating From Jekyll to Hugo, deploying with Github Pages DevFeed: [Migrating From Jekyll to Hugo, deploying with Github Pages]() Original publisher: [Read original article]() Author: brice.dutheil@gmail.com (Brice Dutheil) Published: 2020-04-20T21:42:10Z Content type: tutorial Language: en Sources: [The Coffee Workshop]() Topics: [Jekyll](), [Hugo](), [migration](), [GitHub Pages](), [Markdown](), [WordPress]() Tags: [github-pages](), [hugo](), [jekyll](), [markdown](), [migration](), [wordpress]() ### AI overview This tutorial describes migrating a blog from Jekyll to Hugo and deploying it with GitHub Pages. It discusses challenges including preserving article links and comments, adapting templates and themes, local generation, and importing existing Jekyll content. ### Source excerpt Moving away form Jekyll. Import is easy, but tackling important details (conserve links to article, conserve comments, migrate some jekyll liquid template, theme tweaking deployment) has been challenging sometime. Motivation When started this blog in 2010 I went like a lot other to Wordpress as this was the one of the most common and easy way to write and publish something, then I got pissed at Wordpress as it was a pain to maintain and to write code, not to mention the speed, it was bad, then Github announced Github Pages, this was a revelation : articles written in pure Markdown, no database or server to maintain, fast writing, fast page thanks to static files. There were quite a few things that were icky like theme modifications, and some Wordpress plugins that were simply not there, but once done it was a robust machine. [Next page]()