Tagged “indieweb”

A pain point of the IndieWeb is that it's sometimes not as convenient to share content as it is on the common social media platforms… That’s why I wanted to improve this process for my site.

This was a fantastic walkthrough by Max. And based on this, I’ve just finished implementing an easy-bookmarking feature on my own website.

I already use this site to save Bookmarks so I’m hooking into that. For the bookmark-saving form, I’ve used Stimulus rather than Preact. But otherwise this is very much based on Max’s superb tutorial.

Here’s my bookmarklet code so that future-me can create a new browser bookmark, edit it and paste this in.

javascript:(function(){var title = document.getElementsByTagName('title')[0].innerHTML;title = encodeURIComponent(title);var selection = '';if (window.getSelection) {selection = window.getSelection().toString();} else if (document.selection && document.selection.type != 'Control') {selection = document.selection.createRange().text;}selection = encodeURIComponent(selection);new_window=window.open('https://fuzzylogic.me/bookmarker/?title='+title+'&body='+selection+'&url='+encodeURIComponent(document.location.href),'Sharer','resizable,scrollbars,status=0,toolbar=0,menubar=0,titlebar=0,width=680,height=700,location=0');})();

Incidentally, this process also provided a great way to dip my toes into the world of Netlify Functions and their supporting tools, netlify-dev and netlify-lambda.

There’s more to be done but I wanted the first bookmark created with my shiny new system to be a link to Max’s original tutorial – and this post is it.

Many thanks, Max!

webmention.app is a great new project by Remy Sharp. He created it because he noticed that while adding webmentions to your site is relatively straightforward, sending outgoing webmentions is less so.

At the moment my personal website is Perch-based and I have webmentions enabled, so let’s see what happens when I link to Remy’s explainer article.

Linking to a variety of test posts on webmention.rocks to see if my comment shows up on each of them.

The software/library I’m using is Perch.

• 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

Update: it worked! See the screenshot above for proof.

Note: I wrote this article back in 2018 when I had a PHP-based site and used Perch as my CMS. I haven’t implemented webmentions on my current, 11ty-based site (end of note).

I’ve recently added webmention capability in my CMS. Webmention is one of the building blocks of the Indieweb movement. The idea is that if my article links to another person’s article then my website will notify theirs and if their site also supports webmention then they can show beside their article that I’ve linked to it.

Likewise, other sites can notify mine if they’ve linked to mine. In this way, I eventually hope to have likes, comments etc from sites such as Facebook and Twitter fed back to here so that I can display them beside the source article.

I’m now going to test webmentions by linking to this article on the topic by Aaron Parecki. Let’s see if something shows up on his site.