Skip to content
This day’s portion

Adding webmentions to Jekyll (an overview)

/ Comments

I have webmentions working on a Jekyll site (they even get their own anchor link).

Here’s an overview of what I did (this explanation assumes knowledge of what an API is and some general programming concepts):

  • I set up webmentions and Bridgy
  • I installed the jekyll-get-json plugin to parse my webmention endpoint
  • jekyll-get-json makes each webmention object available in a Jekyll array, which you loop through as you would any other array
  • I added some code to my comment-form.html include that checks whether the page slug is the same as the webmention target slug. If so, it adds the webmention object to a new array. (Incidentally, Liquid – Jekyll’s templating language – is surprisingly powerful when it comes to text and arrays. I was able to convert a string to an array using a / delimiter, remove empty items from that array and return its last item as a new string in one line of code.)
  • The code loops through the new array, outputting the mention author, source, date and content. It also creates an in-page link to the comment by using the websmetion comment ID.
  • I subscribe to my webmention RSS feed to get a notification whenever there’s a new mention. I could get this to fire a site build on Netlify, so the mention would appear minutes after it was made (but there’s not much point, and I’m looking to limit Netlify build minutes so I don’t get charged).

See the code (from line 68).

There is a semi-official webmention plugin from Aaron Gustafsson, but this has a <4.0 Jekyll dependency. So, I am half tempted to try and build my first Jekyll plugin. After all, Jekyll is popular blogging software, and I’m guessing its users would be quite receptive to hooking into the indieweb.

Add a comment

Required fields marked *. I won’t publish or share your email address.

Comments

None 🦉.

Mentions

Comments and replies to this post from other sites and services, such as micro.blog and Twitter.

Tim CulverhouseTim Culverhouse

I added webmentions to my site today! I found @leonp’s post which made it all really easy.

I haven’t automated rebuilds or sending yet, that will still be manual for now…but nothing wrong with incrementalism!

Mike HarleyMike Harley

@jayeless Thanks for the info! I was looking at webmentions.io. I noticed it was an open source project and was a little intimidated by the repo.

JessicaJessica

@obsolete29 You're welcome! I guess you could self-host your own instance of the webmention.io backend, but what I did was just create an account on the website. Guess it's up to you, if you feel like the challenge :)