I continue my journey into the world of the Indieweb by attempting to add webmentions to my static Jekyll site.
My understanding of webmentions is this.
A two way notifcation of activity surrounding your content:
- When you mention someone’s website or specific post in your blog, they will get notified that you discussed their content. If the site accepts webmentions, they get notified!
- When someone mentions your website or specific post in THEIR blog, you get notified the they discussed your content. If your website accepts webmentions, you get notified!
- Webmentions can include replies (comments) but that’s the next step - not covered here from what I can tell.
This required some outside vendor assistance, which seems like a cheat. The IndieWeb’s whole idea is to OWN ALL THE THINGS as it pertains to your content.
I’m ok with this cheat for now, because I am having some difficulty understanding the conccept of webmentions. Hoping that getting it configured will trigger the right synapses is this brain.
The guide I’ve been following was a little sparse when it came to how to setup webmentions, so I ended up following Daniel Aleksandersen’s guide for this piece. A great read, and I truly did get webmentions configured in ten minutes! It took a lot longer to write this post than to set it up.
My specific configuration is this:
- A Jekyll static site
- Pushed to GitHub
- Deployed to Cloudflare Pages
- Webmention notifications RECEIVED by Webmention.io
- Webmention notifications SENT by webmention.app
- IFTT RSS New Post Trigger to webmention.app to send out webmention notifications to others.
Utilizing the Webmention.io, I configured my site to RECEIVE webmentions from the outside world.
To utilize this service, you first have to get IndieWeb Auth configured on your site. Luckily that was step two in my journey, and got it working already. It wasn’t nearly as difficult as you’d think! No outside vendors required.
After logging in, there’s not much to do on the site. You need to generate a token, and then you are provided with some
<link> tags to add to the
<head> of your Jekyll site. I have a head.html include that is added to all my pages, so just added them there.
One step that could be difficult for a static site like Jekyll is the recommendation to add the following to your HTTP HEAD requests.
1 Link: <https://webmention.io/example.com/webmention>; rel="webmention"
I use Cloudflare Pages to host my site right now. It’s something I use at work and feel comfortable using, but may switch to Netlify for personal work.
So it’s fairly simple to get your static site to send this response header. Just add a _headers file to the root of your site, and make sure it’s not ignored by your git repository. It should be included when you deploy to Cloudflare. It includes all the information needed to add that response header to your site.
Note the .well-knowns are not specifically part of webmentions, but are utilized by IndieWeb and the Fediverse in general. You can ignore those for now.
1 2 3 4 5 6 7 8 9 10 11 /* Link: <https://webmention.io/example.com/webmention>; rel="webmention" /.well-known/webfinger Content-Type: application/jrd+json /.well-known/host-meta Content-Type: text/xml /.well-known/nodeinfo Content-Type: application/json
I verified the header was appearing using DevTools after publishing the changes to my site.
The next step was to setup SENDING OUT webmentions from my posts - if any of the URLs I mention on the page are also setup to receive webmentions, they will get pinged. Curious if this excludes links to my own site, or if I get notfied for those as well.
This utilized the second external service, webmention.app. It requires that you have a GitHub account. It has a nice little wizard to walk you through the process. I chose the “I have an RSS feed” option, which then required another service - IFTT - to check your RSS feed for new posts. (see? too many external services going on here to get my real IndieWeb badge of honor, but I want to just get this setup and see how it works for now).
I tested my homepage using the following webmention.app endpoint, and it did return a value. I don’t have any posts yet that include sites that accept webmentions, so testing anything other than my homepage didn’t work.
This blog entry is actually part of the exercise! The validation site Webmention Rocks! guides you through a test of your configuration. Just include links to some sites that are known to accept webmentions.
Here’s hoping it works! I’ll follow up with another post about my success or failure.
Here are the list of sites to include for testing purposes. * Test 1 * Test 2 * Test 3 * Test 4 * Test 5 * Test 6 * Test 7 * Test 8 * Test 9 * Test 10 * Test 11 * Test 12 * Test 13 * Test 14 * Test 15 * Test 16 * Test 17 * Test 18 * Test 19 * Test 20 * Test 21 * Test 22 * Test 23