Adding webmentions to Jekyll (an overview)

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.