Design & Code

How to Automatically Create Google Calendar Events from a Google Sheet

If you need to automatically create Google Calendar events from data in a Google Sheet, this pared-down example should work well for you.

Feb 12, 2023 •

Building a Content Accordion with CSS-Only Toggle Switches (Checkbox Hack)

I created a page to share my training goals and commentary, using Eleventy magic, a CSS-only toggle, and the checkbox hack.

Nov 26, 2020 •

How to Export Strava Workout Data

If you're a numbers geek AND a fitness geek like me, you've wanted to export Strava data. You've realized with dismay that Strava doesn't have any kind…

Oct 16, 2020 •

How To Create Interactive Maps with React and Leaflet

After being dedicated mountain pass holders, then Ikon pass holders, then nomads purchasing advance tickets, I thought it'd be cool to create a…

May 28, 2020 •

The Locker Prank

When I read about this Popular Mechanics Riddle of the Week, I knew I could solve the problem by writing code.

Apr 28, 2020 •

Create an Aggregated Map of Your Strava Fitness Routes

I'm not map-obsessed, no. But I'm probably somewhere on the spectrum. I've been fascinated with maps as long as I can remember.

Feb 2, 2018 •

Create a Custom Post Type in Wordpress with Database Content

I implemented a custom page template in Wordpress that would retrieve data from the database using Ajax.

Mar 27, 2017 •

Using CSS to Responsively Embed Vimeo on Wordpress

When you embed a Vimeo video on a Wordpress web site by using a short code, there's only an option to pass in a static width and height.

Feb 3, 2017 •

Floating Footer Notification

This floating footer notification code sample shows a toaster at the bottom of the page, regardless of the user scroll, but you could put it anywhere in…

Apr 2, 2016 •

A Bookmarklet for Confining Google Search Results to a Specific URL

We were looking for a simple way to search a web site from a specific path, not just from the root.

Apr 3, 2014 •

Creating a Variable-Width Modal Dialog Using Bootstrap 3

I've enjoyed using Bootstrap 3 lately, but was limited by the fixed-width of the modal dialog boxes. I wanted to override the default Bootstrap modal so…

Oct 16, 2013 •

Counting down with jQuery or CSS3 (or, Puff the Magic Countdown)

I wanted to replicate a 'text puff' effect on a web page, so went about it using two different techniques: jQuery UI (puff transition) and CSS3…

Jul 14, 2013 •

#nojs-banner { position: fixed; bottom: 0; left: 0; padding: 16px 16px 16px 32px; width: 100%; box-sizing: border-box; background: red; color: white; font-family: -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; font-size: 13px; line-height: 13px; } #nojs-banner a { color: inherit; text-decoration: underline; } This site requires JavaScript to run correctly. Please turn on JavaScript or unblock scripts