Introduction to what one would consider basic web communication
A few days ago I had written a post on my website and a colleague had written a reply on his own website. Because we were both using the W3C Webmention specification on our websites, my site received the notification of his response and displayed it in the comments section of my website. (This in and of itself is really magic enough–cross website @mentions!)
To reply back to him I previously would have written a separate second post on my site in turn to reply to his, thereby fragmenting the conversation across multiple posts and making it harder to follow the conversation. (This is somewhat similar to what Medium.com does with their commenting system as each reply/comment is its own standalone page.)
Instead, I’ve now been able to configure my website to allow me to write a reply directly to a response within my comments section admin UI (or even in the comments section of the original page itself), publish it, and have the comment be sent to his reply and display it there. Two copies for the price of one!
This means that now, WordPress-based websites (at least self-hosted versions running the WordPress.org code) can easily and simply allow multiple parties to write posts on their own sites and participate in multi-sided conversations back and forth while all parties maintain copies of all sides of the conversation on their own websites in a way that maintains all of the context. As a result, if one site should be shut down or disappear, the remaining websites will still have a fully archived copy of the entire conversation thread. (Let’s hear it for the resilience of the web!)
What is happening?
This functionality is seemingly so simple that one is left wondering:
- “Why wasn’t this baked into WordPress (and the rest of the web) from the start?”
- “Why wasn’t this built after the rise of Twitter, Facebook, or other websites which do this as a basic function?”
- “How can I get it tout suite?!” (aka gimme, gimme, gimme, and right now!!!)
While seeming simple, the technical hurdles aren’t necessarily because there had previously never been a universal protocol for the web to allow it. (The Webmentions spec now makes it possible.) Sites like Facebook, Twitter, and others enable it because they’ve got a highly closed and highly customized environment that makes it a simpler problem to solve. In fact, even old-school web-based bulletin boards allowed this!
But even within social media one will immediately notice that you can’t use your Facebook account to reply to a Twitter account. And why not?! (While the web would be far better if one website or page could talk to another, these sites don’t for the simple economic reason that they want you using only their site and not others, and not enabling this functionality keeps you locked into what they’re selling.)
I’ll detail the basic set up below, but thought that it would be highly illustrative to have a diagram of what’s physically happening in case the description above seems a bit confusing to picture properly. I’ll depict two websites, each in their own column and color-coded so that content from site A is one color while content from site B is another color.
It really seems nearly incomprehensible to me how this hasn’t been built into the core functionality of the web from the beginning of at least the blogosphere. Yet here we are, and somehow I’m demonstrating how to do this from one WordPress site to another via the open web in 2017. To me this is the entire difference between a true Internet and just using someone else’s intranet.
Implementation
Prerequisites
While this general functionality is doable on any website, I’ll stick to enabling it specifically on WordPress, a content management system that is powering roughly 30% of all websites on the internet. You’ll naturally need your own self-hosted WordPress-based website with a few custom plugins and a modern semantic-based theme. (Those interested in setting it up on other platforms are more than welcome to explore the resources of the IndieWeb wiki and their chat which has a wealth of resources.)
Plugins
As a minimum set you’ll want to have the following list of plugins enabled and configured:
- Webmentions
- Semantic Linkbacks
- IndieWeb Plugin (optional)
Other instructions and help for setting these up and configuring them can be found on the IndieWeb wiki, though not all of the steps there are necessarily required for this functionality.
Themes
Ideally this all should function regardless of the theme you have chosen, but WordPress only provides the most basic support for microformats version 1 and doesn’t support the more modern version 2 out of the box. As a result, the display of comments from site to site may be a bit wonky depending on how supportive your particular theme is of the microformats standards. As you can see I’m using a relatively standard version of the TwentySixteen theme without a lot of customization and getting some reasonable results. If you have a choice, I’d recommend one of the following specific themes which have solid semantic markup:
Plugin
The final plugin that enables sending comments from one comment section to another is the WordPress Webmention for Comments plugin. As it is still somewhat experimental and is not available in the WordPress repository, you’ll need to download it from GitHub and activate it. That’s it! There aren’t any settings or anything else to configure.
Use
With the plugin installed, you should now be able to send comments and replies to replies directly within your comments admin UI (or directly within your comments section in individual pages, though this can not require additional clicks to get there, but you also don’t have the benefit of the admin editor either).
There is one current caveat however. For the plugin to actually send the webmention properly, it will need to have a URL in your reply that includes the microformats u-in-reply-to
class. Currently you’ll need to do this manually until the plugin can properly parse and target the fragmentions for the comments properly. I hope the functionality can be added to the plugin to make the experience seamless in the future.
So what does this u-in-reply-to
part actually look like? Here’s an example of the one I used to send my reply:
<a class="u-in-reply-to" href="https://islandinthenet.com/manually-adding-microfomats-markup/">Khürt</a>
The class tells the receiving site that the webmention is a reply and to display it as such and the URL is necessary for your webmention plugin to know where to send the notification. You’d simply need to change the URL and the word (or words) that appear between the anchor tags.
If you want to have a hidden link and still send a webmention you could potentially add your link to a zero width space as well. This would look like the following:
<a class="u-in-reply-to" href="http://www.example.com">​</a>
Based on my experiments, using a <link>
via HTML will work, but it will send it as a plain webmention to the site and it won’t show up natively as a reply.
Sadly, a plain text reply doesn’t work (yet), but hopefully some simple changes could be made to force it to using the common fragmentions pattern that WordPress uses for replies.
Interestingly this capability has been around for a while, it just hasn’t been well documented or described. I hope now that those with WordPress sites that already support Webmentions will have a better idea what this plugin is doing and how works.
Future
Eventually one might expect that all the bugs in the system get worked out and the sub-plugin for sending comment Webmentions will be rolled up into the main Webmentions plugin, which incidentally handles fragmentions already.
Caveats
In addition to the notes above, I will say that this is still technically experimental code not running on many websites, so its functionality may not be exact or perfect in actual use, though in experimenting with it I have found it to be very stable. I would recommend checking that the replies actually post to the receiving site, which incidentally must be able to accept webmentions. If the receiving website doesn’t have webmention support, one will need to manually cut and paste the content there (and likely check the receive notification of replies via email, so you can stay apprised of future replies).
You can check the receiving site’s webmention support in most browsers by right clicking and viewing the pages source. Within the source one should see code in the <head> section of the page which indicates there is a webmention endpoint. Here is an example of the code typically injected into WordPress websites that you’d be looking for:
<link rel="webmention" href="http://example.com/wp-json/webmention/1.0/endpoint" />
<link rel="http://webmention.org/" href="http://example.com/wp-json/webmention/1.0/endpoint" />
Also keep in mind that some users moderate their comments, so that even though your mention was sent, they may need to approve it prior to it displaying on the page.
If you do notice problems or issues or have quirks, please file the issue with as full a description of what you did and what resulted as you can so that it can be troubleshot and made to work not only for you, but hopefully work better for everyone else.
Give it a try
So you’ve implemented everything above? Go ahead and write a reply on your own WordPress website and send me a webmention! I’ll do my best to reply directly to you so you can send another reply to make sure you’ve got things working properly.
Once you’re set, go forward and continue helping to make the web a better place.
Special Thanks
I wanted to take a moment to give special thanks to Aaron Parecki, Matthias Pfefferle, and David Shanske who have done most of the Herculean work to get this and related functionality working. And thanks also to all who make up the IndieWeb community that are pushing the boundaries of what the web is and what it can accomplish. And finally, thanks to Khürt Williams who became the unwitting guinea pig for my first attempt at this. Thank you all!
Looks interesting, adding it to my reading list.
Chris, happy I was able to help. I’ve already installed the code. It works. I don’t see any issues so far.
Hi Chris, please reply to this – I’m curious what the webmention my site gets looks like!
, I’m still doing some modifications to my mark up to improve what is sent using this method, since it is presently slightly different than a traditional webmention. But either way, here you go!
Hi Chris, please reply to this – I’m curious what the webmention my site gets looks like!
Threaded Replies and Comments with Webmentions in WordPress by Chris Aldrich (Chris Aldrich | BoffoSocko)
This is fracking bloody awesome!
Syndication Links :
islandlife.blog TwitterTwitter
Like this:
Like Loading…
<img alt="" src="https://secure.gravatar.com/avatar/7fa94585b903e6e183d6164b16b1b573?s=42&r=pg" srcset="">
<h2><span>Author:</span> Khürt Williams</h2>
Gen X-er near Princeton University in Montgomery Township, New Jersey, with a passion for aquariums, terrariums, technology, and photography. I love hiking in the woods, and my eclectic musical tastes span soca, Afrobeat, calypso, 1990s rap, grunge rock, and alternative genres. <a href="https://islandinthenet.com/author/khurtwilliams/" rel="author">
View all posts by Khürt Williams </a>
Syndicated copies:
Oh, wow. That’s amazing; I didn’t know this was something possible on the web.
Usenet shall be reborn!
Not yet, I haven’t yet really got the hang of replies in general, but I’ll be sure to try it out soon. And thanks for the great post.
@c Just read over your post on Threaded Replies at Boffosocko. Thanks for explaining the implementation so clearly and with such enthusiasm. I’m still working at understanding the nuances of the Indie Web with my own site. Your post helps.
@andrewford I keep a collection of related posts that you might appreciate as well: http://boffosocko.com/research/indieweb/
Syndicated copies:
@c Thanks for the heads-up. I’m just reading about the Post Kinds plugin. I’m trying to use the provided WordPress remove_filter code in functions.php so I can customise the display, but it doesn’t appear to prevent the plugin from injecting it’s code before the content. Do you know anything about how this is meant to work?
Syndicated copies:
@andrewford I’ve not tried that specifically before, so I’m not 100% sure. I know you can customize individual templates as well too. Your best bet is to catch GWG in the IndieWeb WordPress chat channel. He wrote the plugin and is always happy to help. He’s also home most of the day today for a snow day… https://chat.indieweb.org/wordpress/
Syndicated copies:
This is fascinating Chris, thanks for sharing. This functionality reminds me a bit of the GNU Social plug-in for WordPress, which was created to allow comments on a WP blog to appear both on the blog, and in the poster’s timeline on the GNU Social host they microblog on.
I’m not sure if this WP-plugin is being actively used any more. If it is, it will soon need a major rebuild to use the ActivityPub standard that will effectively replace OStatus over the next year or two, as the flagship standard for decentralized microblogging. It would then become compatible not just with GNU Social, but with all the federated social network apps collectively known as the “fediverse” (except for Diaspora).
Further research shows there’s already more actively developed OStatus plug-in for WordPress that supports both GNU Social and Mastodon, and a bunch of other WP-plugins for Mastodon, which between them provide some or all of the required functions for AP support. There’s also the WordPress plug-in for the Charitable platform, who are now promoting their AP support. I presume all of this work depends on the WP-plugin for ActivityStreams, one of the protocols used in both OStatus and ActivityPub.
BTW Somewhat ironic that were are both advocates of a decentralized web, and critics of the corporate datafarms (“someone else’s intranet” as you put it), yet here we are making contact on a corporate datafarm, created by a founder of one of the current titans of datafarming 😉 I’m curious, do you mirror your writing here to increase discoverability, or do you write separate streams of content for your WP site and for Medium?
Syndicated copies:
Danyl, sorry I hadn’t seen your response until now. I don’t spend much time on Medium and don’t see notifications from it.
I’m all-in on the IndieWeb philosophy of POSSE (Post to your Own Site, Syndicate Elsewhere), so all my content originates on my personal site and is syndicated out, typically to reach friends, family, and additional audience. Most platforms I syndicate to, I have means of getting responses backfed to my site using Webmention to provide notifications of interaction. Sadly Medium doesn’t play nicely on this front.
I watch a lot of this space pretty closely and know most of the programmers and players in the space. HongPong, who you link to, I know more as a Drupalista than a WordPresser. The OStatus/AP related plugins you’ve linked to are from Mathias Pfefferle who is one of my favorite programmers and my personal site relies on quite a bit of his work.
One effort you have missed which is very interesting is Ryan Barrett’s Fed Brid.gy effort which is well worth looking at for it’s ability to work across multiple platforms and bridge the worlds of IndieWeb and Activity Pub protocols.
Syndicated copies: