Web-Development

benstraw.com Has a New Look

The benstraw.com home page: the heading "One picture at a time" above a photo of Billy Strings on stage at the Orpheum Theatre in Los Angeles

My photography site, benstraw.com, has a new look. Come see it, one picture at a time.

Screenshot-a-Day: An Archive, Not an Alarm

The Screenshot-a-Day project card: "A visual history you own", beside three stacked browser captures of the same page dated June 04, July 19, and August 17, tagged 0.42% changed

A theme update breaks a hero image on Safari. A hosting provider changes a default. A CMS plugin starts injecting something. Nobody notices for six weeks, and when someone finally does, the only honest answer to “when did this start?” is a shrug. I have given that shrug more than once. This week I shipped Screenshot-a-Day v0.1.0 so I would stop having to. The idea is not new around here. It has been sitting on this site as a sketch since May 2024, back when I assumed the answer was a $10/year SaaS running Puppeteer on a Lambda. What actually shipped went the other direction on almost every one of those assumptions, and the reasons are the interesting part.

A Theme Meets a Stranger

I clicked the “Latest release” badge in Ryder’s README and landed on v0.0.1-alpha, dated January 2024. That would have been unremarkable if it were the latest release. It wasn’t. Ryder had shipped v0.1.0 through v0.2.4, but the release workflow marked every automated release as a prerelease. GitHub excludes prereleases from that badge, so two years of releases were present, downloadable, and effectively invisible from the project’s front door.

Building OCR-Powered Search for a Family Photo Gallery

The technical journey of adding search to 3,400+ scanned photo album pages. View the live search

Adding Leaflet to Ryder Theme

A Ryder theme page displaying an interactive Leaflet map

I made this quick and easy shortcode to get started using leaflet.js in the Ryder Theme for Hugo Websites, as I add more features supported by leaflet to the shortcode I might update this page.

Pines Image Gallery With Hugo

A super simple alpinjs image gallery The first place I used this is on the recipe page about my mom’s family recipe cookbook

The Ryder Theme for Hugo

In honor of this old guy Introducing the Ryder theme, a theme for the hugo static website generator. This is an open-source Hugo theme boasting Tailwind CSS, FontAwesome integration, and customizable features. Perfect for beginners and seasoned developers alike, kickstart your website with this versatile theme.

Styling a RSS feed With XSL

A styled RSS feed makes your site more usable When you put a link to your rss / atom feed on your website it is a link to a raw xml file designed for feed readers such as feedly to import them and provide the reader with all their internet in one place.

Github Action to Create New Content in Hugo

This is what it looks like I use Hugo a lot for my web development work, and I think it is pretty great. The one problem with it for many non-technical people I work with is that there is no CMS feature, they want a website administration page where they can do the usual.

Hugo Helpers

Here are some useful partials I use in this theme. layouts/_default/_markup/render-image.html This replaces the default markup template for rendering an image when the markdown code ![Alt Text](/path/to/img.jpg) is used. It calls another partial you have to add to your theme or layout directory in your site called ImageConverter.