indieweb-bashblog: a single script SSG with Webmentions and more
—
Jo (CC BY-NC)
Bashblog is a static site generator contained within a simple shell script. It's a "very, very simple way to post entries to a blog by using a public folder on (a) server, without any special requirements and dependencies".
I've used it for 2-3 years now and since people seemed interested in how I combine such things as Webmentions with my static setup, I thought I would package this neatly within a fork of the original software.
In this post I will briefly cover the additions and changes and give a step by step tutorial on how to use this script for beginners on the command line.
Background
A few months ago, while talking about static sites and webmentions in the indieweb chat, someone asked how I combine bashblog and webmentions in my setup.
# 19:07
[Jo] ↩️ i personally use bashblog! My webmention receiver is http://webmention.io and to display the mentions under each post i use webmention.js (https://github.com/PlaidWeb/webmention.js/ )I do have to send them manually though
# 19:12
onla gRegor: ok. I wonder what tools are preferred to do those steps if you are running a static site. [Jo] cool. You haven't by any chance written a blogpost on how you do it, maybe more details?
# 19:14
[Jo] no i havent, but i could make one
# 19:15
onla Sending webmentions manually does seem like not much extra effort. This receiving part and displaying them on your own page doing them automatically sort of is the tricky part I guess.
# 19:16
onla [Jo]: it could be useful to more than just to me. I think some others might also want to know some "barebones" ways ppl might use. Well I didn't check how possibly bloated this webmention.js but I guess it's not very etc :)
I'd never before considered that my setup could be useful to other people. My personal setup has evolved over time and it really shows in how badly it works. But after being asked to write a blogpost about it, I resolved to do a little better than that — and so I made a fork of bashblog with a few IndieWeb technologies built in, that people who are new to the community seem especially interested in!
What's new
Semantics and microformats
The original bashblog is a bit <div> heavy for my tastes, as well as invalid HTML (one of the first things I adjusted on bashblog for my personal uses was to make <h2> follow <h1>). The indieweb-bashblog script adds microformats to semantic HTML tags; at the time of writing these include:
- h-feed
- h-entry
- h-card
- u-photo
- u-url
- p-name
- p-author
- dt-published
- e-content
- u-like-of
- u-in-reply-to
- u-bookmark-of
- p-rsvp
The CSS is now a slightly adjusted version of that used on bearblog.
Webmention
The script includes very primitive setup for sending one Webmention automatically. Upon running the script one is promted with the option to send a Webmention: a like, reply, RSVP or bookmark. This webmention will be sent after the post is published.
To display received webmentions on the blog, the script uses webmention.js by fluffy. This part requires JavaScript (obviously).
Both of these features can be turned off by unsetting the variables global_wm_enabled and global_display_wm respectively.
Open Heart
At the bottom of each post is a <❤️>. While building, this is turned into code for the Open Heart protocol, enabling readers without Webmentions to leave a like. To remove this, simply remove the <❤️> while writing or permanently by editing the script.
This part requires JavaScript.
Tutorial
Setup
Change into a directory facing the web. This can be on your own sever or a shared one. For example
cd ~/public_html
Download the script and make it executable; then open the file
wget https://raw.githubusercontent.com/muscadomestica/indieweb-bashblog/refs/heads/master/bb.sh && chmod +x bb.sh
nano bb.sh
You will at the least want to adjust these variables
global_title="My fancy blog"
global_description="A blog about turtles and carrots"
global_url="https://example.com/blog"
global_icon=""
global_author="John Smith"
global_email="john@smith.com"
global_wm_endpoint="https://webmention.io/example.com/webmention"
You can replace the Webmention endpoint with a local one, but if you don't have one I recommend logging into webmention.io. For now replace "example.com" in there with your own domain; you can log in later.
Publish a post
I recommend using bashblog with markdown. To see if it is installed, run
markdown -v
To publish a post, simply run
./bb.sh post
On first use it will download the webmention.js for displaying received mentions, if this has not been unset. Then it will prompt:
Do you want to send a webmention? y/N
Let's say we do want to send a webmention.
> y
(L)ike/(Re)ply/(B)ookmark/(Rs)vp?
> l
URL:
> https://dead.garden/blog/indieweb-bashblog-a-single-script-ssg-with-webmentions-and-more.html
Message:
> I just installed this bashblog version!
After this you will get to write your post and it'll be pretty self explanatory from there on! Make sure to leave the generated HTML code as it is unless you know what you are doing. You can move it to elsewhere inside the post, if you like.
Login to webmention.io
Once a page has been generated, you can head to webmention.io and create an account.
After entering your domain (make sure it is the same as your global_url) you will be faced with something like this:
Follow the steps layed out on the website.
Troubleshooting
Does something look weird? Try running
./bb.sh rebuild
This usually takes care of it.
And that's it! Happy blogging :^)
What's next?
I could imagine adding more microformats and through that support for more types of Webmentions. One that springs to mind is u-syndication ;^)
Category: tech
