How-to Guide

Add a privacy‑first appreciation button to your Hugo site: iine features, install steps, and partial template code. Improving small web interactivity.

Read how I moved from third‑party free tools (like OG Image Maker) to D2, a text‑to‑diagram language, for local, customizable OG image generation. Combining D2 with a Bash script helped automate the process and produce ready‑to‑use OG images. The workflow uses CLI image tools (pngquant, cwebp, ImageMagick) and I talk about the benefits of text‑based templates, offline generation, and automation.

Turn your Hugo blog posts into a GitHub-like contribution calendar with Apache ECharts. I’ll show you how to extract blog post metadata to build a heatmap calendar using the Open Source JS Library. Including how to integrate it with Hugo partials and CSS, full code snippets, and tips on how to customize styling, scaling, and tooltip behavior.

Learn how to replace GitHub Pages with SourceHut Builds, Bunny Storage and Bunny CDN. Set up a CI static site deployment workflow replacing GitHub Actions, with tools like SFTP, Rclone, and Curl using SourceHut’s CI platform running on Alpine Linux.

Learn how to customize the ReText Markdown editor with this guide. Explore configuration file tweaks, style sheet adjustments for both the WebEngine preview and Markdown editor panes, and how to use Python Markdown extensions for enhanced functionality. Includes code highlighting setup with Pygements.

Add featured image captions in WordPress with the Code Snippets plugin & a simple shortcode. No theme editing needed.

This post explains how to properly configure Open Graph meta tags to enhance your blog’s appearance when shared on social media. It goes over setup tips for Hugo themes and WordPress plugins, common pitfalls like firewall blocks, and best practices for images and descriptions. Useful for making visually engaging social previews.

RSS feeds are still relevant, so I will share how to validate them and optimize their functionality in WordPress and Hugo. Learn to add featured images, exclude pages, and fix common bugs like invalid XML. With tips on improving RSS descriptions and templates, this guide ensures your blog’s feed is reader-friendly and visually appealing.

Explore my love for Markdown editors, starting with Mou and evolving to ReText, a Python-based editor. Learn why Markdown is a powerful tool for writing, its pros and cons, and how to set up ReText on macOS using Python virtual environments (venv). Plus, discover tips like creating a minimal app bundle for easier use of Python apps on a Mac.

This guide demonstrates how to automate Hugo site deployment to GitHub Pages using a GitHub Action workflow. It covers prerequisites, the workflow itself, and the basic steps to get started.