Threaded Replies and Comments with Webmentions in WordPress

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!

From the comments list in my Admin UI, I can write a reply and it not only lives on my site but it can now be sent as a comment to the site that made the original comment! As an example, here’s my first one and the resultant copy on the site I was replying to.

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.

A diagram of where comments live when sent via webmention.
Each site composes and owns its own content and sends the replies to the other site.

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:

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">&​#8203;​</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!

​​​​​​

Syndicated copies to:

Alpha Release of Linkback Module for Drupal 8 with Webmention Support [8.x-1.0-alpha1]

Alpha Release of Linkback Module for Drupal 8 with Webmention Support [8.x-1.0-alpha1] by Dan FeidtDan Feidt (Drupal.org)
We are proud to bring you the first alpha release of Linkback, an interesting suite of modules which can help integrate your website with the wider internet. Linkback provides the backend functionality to save both outgoing and incoming pings and webmentions involving remote sites.

Drupal 8, now (along with platforms like WithKnown, Perch, WordPress, Craft, Kirby, ProcessWire, Elgg, and Django) has Webmention support. Congratulations to Dan Feidt (aka HongPong) and everyone involved!

This means that more websites can communicate directly with each other on the open and decentralized web. (Wouldn’t you like to “@mention” someone from your own website to theirs?) It’s a rapidly growing reality on the internet.​​​​​

Syndicated copies to:

Reply to Aggregating the Decentralized Social Web by Jason Green

Aggregating the Decentralized Social Web by Jason Green (þoht-hord)
There are actually three problems to solve, reading, which is relatively easy, posting, which is harder, and social graph management, which is quite complex.

Some brief thoughts:

There are actually three problems to solve, reading, which is relatively easy, posting, which is harder, and social graph management, which is quite complex.

I might submit that posting is possibly the easiest of the three and that the reader problem is the most difficult. This is based on the tremendous number of platforms and CMSs on which one can post, but the dearth of feed readers in existence.

Managing your social graph

Something akin to a following list could help this. Or a modified version of OPML subscription lists could work. They just need to be opened up a tad. Some are working on the idea of an open microsub spec which could be transformative as well: https://indieweb.org/Microsub-spec


How do we decentralize the web without so decentralizing our own social presence that it becomes unmanageable?

You’ve already got a huge headstart in doing this with your own website. Why bother to have thousands of accounts (trust me when I say this) when you could have one? Then, as you suggest, password protected RSS (or other) feeds out to others could allow you to control which audiences get to see which content on your own site.


It looks as if Withknown has made some progress in this area with syndication plugins.

WordPress has lots of ways to syndicate content too. Ideally if everyone had their own website as a central hub, the idea of syndication would ultimately die out altogether. At best syndication is really just a stopgap until that point.


Subscribing to my personal timeline(s) with my favorite RSS reader would bring everything together,

I’ve written some thoughts about how feed readers could continue to evolve for the open web here: http://boffosocko.com/2017/06/09/how-feed-readers-can-grow-market-share-and-take-over-social-media/


listed items chronologically independent of source

Having a variety of ways to chop and dice up content are really required. We need more means of filtering content, not less. I know many who have given up on chronological feed reading. While it can be nice, there are many other useful means as well.

Syndicated copies to:

Virtual Homebrew Website Club Meetup on December 13, 2017

Join some like-minded people in building and updating your personal website.

This is a Virtual HWC for IndieWebbers who either can’t make a regular meeting or don’t yet have critical mass to host one in their area. Everyone is welcome to participate remotely!

Virtual Homebrew Website Club Meetup on December 13, 2017
Time:  to
Location: Online via Google Hangouts (link is posted and live)

Details

Join a community with like-minded interests. Invite friends that want a personal site.

  • Work on your IndieWeb Resolutions for 2018
  • Finish that blog post you’ve been working on
  • Demos of recent IndieWeb breakthroughs
  • Share what you’ve gotten working
  • Ask the experts questions

A link to virtual meetup on Google Hangouts will be posted on the day of the event. Check back before the meeting to get the link: https://hangouts.google.com/call/0JCH5b875C2UNseSnfkxAAEE

Optional quiet writing hour: 19:30–20:30 ET (16:30-17:30 PT)
Meetup: 20:30–21:30 ET (17:30-18:30 PT)

The IndieWeb is a growing people-focused alternative to the ‘corporate web’.

Skill levels: Beginner, Intermediate, Advanced

Keep in mind that there is often a European virtual meetup if those times work better for your schedule.

Any questions? Need help? Ask in chat: http://indiewebcamp.com/irc/today#bottom

RSVP

Add your RSVP in the comments below; by adding your indie RSVP via webmention to this post; or by RSVPing yes to one of the syndicated posts below
Indieweb.org event: https://indieweb.org/events/2017-12-13-homebrew-website-club#Virtual_Americas
Facebook.com: https://www.facebook.com/events/169650146961455/
Meetup.com: https://www.meetup.com/IndieWeb-Homebrew-Website-Club-Los-Angeles/events/245539015/

If your site doesn’t support sending webmentions yet, you should be able to create a post on your website with the following HTML:

<div class="h-entry">
RSVP <span class="p-rsvp">yes</span>
to <a href="http://boffosocko.com/2017/11/30/virtual-homebrew-website-club-meetup-on-december-13-2017/" class="u-in-reply-to">Virtual Homebrew Website Club Meetup on December 13, 2017</a>
</div>

Then put the permalink URL for your post into the webmentions box in the comments section. My site should be able to parse your URL and display the response. (Naturally, you can also change your response to “no” or “maybe” depending on your ability to attend.)

(I think this may be my first indie event that I’ve posted to my WordPress site.)

Syndicated copies to:

👓 Pivot time: searching for an Open Web blogging model | AltPlatform

Pivot time: searching for an Open Web blogging model by Richard MacManus (AltPlatform)
We launched this blog less than three months ago to explore the latest in Open Web technologies. Things like the IndieWeb movement, blockchain apps, API platforms, Open AI, and more. AltPlatform has always been an experiment, as I made clear in our introductory post. However, from a publishing point of view the experiment hasn’t worked out as we had hoped. To put it plainly, the page views haven’t eventuated – at least in a sustained way. So it’s time to try something new. We’re going to pivot into something a bit different…soon.

I’m a bit saddened by this, but it’s always fun to try out new things. Can’t wait to see what comes next.

I love ricmac’s conceptualization of blogging and hope it comes back the way he–and I–envision it.

Syndicated copies to:

Resources from Domains 2017

Domains 2017 Conference (Reclaim Hosting)
Indie EdTech and Other Curiosities, June 5-6, 2017 at University of Oklahoma

Twitter Stream for #Domains17

Keynote: Neither Locked out nor locked in by Martha Burtis

Live-streamed videos from Virtually Connecting

DoOO Curriculum on Github

JBJ blogpost: Looking back at #Domains17

Syndicated copies to:

Introducing AltPlatform & our manifesto for the Open Web | AltPlatform

Introducing AltPlatform & our manifesto for the Open Web by Richard MacManus (AltPlatform.org)
Welcome everyone to AltPlatform, a non-profit tech blog devoted to Open Web technologies. What do we mean by “Open Web”? Firstly, we want to experiment with open source (like this WordPress.org blog) and open standards (like RSS). We’re also using the word open to signify a wider, boundary-less view of the Web. In other words, we want to look for opportunities beyond the Walled Gardens – proprietary platforms like Facebook and Twitter where you don’t own your own data, you have little control over your news feeds, and you have to live by certain rules.

This looks like a must-read blog for Indieweb proponents.​​

Syndicated copies to:

Mastodon.Social isn’t as Federated or as Decentralized as the Indie Web

Mastodon may be the hot thing in social media right now, but you could be living closer to the bleeding edge of true openness and freedom

Mastodon.social is the cool new social platform[1][2], and certainly prettier than many of the other federated GNU social instances. My Twitter feed is full of mastodon mentions right now with many people saying “I’m on mastodon.social now as _____, come follow me.”–a phrase I haven’t seen since the last social boom in 2009 before the new class of multi-billion dollar corporations began monetizing their users.

I like the cute mastodon imagery and the concept of a “toot”, but isn’t this yet another social media silo that’s going to own all my content and have control over how I interact with it? What happens when everyone gets tired of it? What happens weeks, months, years from now when it decides to shut down or gets bought out like so many others?

Federated and Decentralized

The buzzwords of the week seem to be “federated” and “decentralized”. I’m glad that tens of thousands of people are being introduced to these concepts this week, but they’re definitely not new, and they’re far from perfected.

If we want openness, federation, identity, flexibility, and control why not just have our own website? They can do pretty much everything that most of the social networks can do now, but with much greater freedom. They’d probably be even stronger if people hadn’t ceded their lives and all their thoughts to Facebook, Twitter, Instagram, et al.  Many people in the Indieweb community are already leveraging their own sites and some simple code to do just this.

My Website is an Example

My site is mine. I own the domain name and all the data that gets posted to it. I can write as much or as little as I want about anything I like. No one is artificially limiting me for length. I can post photos. I can post audio, even video. I can write a comment on my own site about something on another site and I don’t have to hope it won’t be moderated out of existence. If I don’t like it, I can edit it (I’m looking at you Twitter) or delete it at any time and know it’s gone (I’m looking at you Facebook).

I support the W3C Webmention recommendation so you can write something on your site and send me the equivalent of an @mention (one which will work across website boundaries instead of being stuck inside them like Twitter, Medium, and Facebook all do). Your mention will then allow your post to show up on my site as a comment! Yes, you hear that correctly. You can use one website to comment on another that’s completely unrelated to the first.

If you don’t have webmention set up yet (via a plugin or other implementation), just add the permalink of my post to your reply on your own site and then put your post’s permalink into the URL labeled box below and click “Ping Me”. Shazam! I have a copy of your comment, but you still own what you wrote to me. Now that’s true website to website federation because it uses open standards that aren’t controlled by third party corporations.

Incidentally I also syndicate many of my posts to the walled gardens like Facebook, Twitter, Instagram, Google+ (where people apparently really love ads served within their content) so I’m not completely cut off from my social graph. Comments and reactions from those silos come back to live with my original posts so everything lives here on my site–future-proofed against their possible disappearance. It also means the conversation doesn’t need to be fragmented across multiple platforms anymore.  Are you reading this on or from one of them? Go back, click like, favorite, or write a reply/response/comment where you saw it and it will magically be transported back to me–with the ability for me to moderate it away if you’re rude.

Dig a few layers deeper

So if we’re going to be excited about federating and decentralizing this week, why don’t we take it one or two layers further?!

Domains can be as inexpensive as $1 with most in the $10-15 a year range and simple web hosting (usually with one-button website installations) costing from $5-20 a month at the lower ends. You can do it yourself–I promise. And if you think you can’t, try a quick web search for the answer or start with http://indieweb.org/getting_started. It’ll give you something to do while signups for the Mastodon.social server are turned off due to overload. Why try to be one of the trendy kids when you can easily go “old-school” and do it yourself with more control? (And heck, if you really can’t do it yourself, I can either help you or you can try it out on an instance of WithKnown that I spun up just to let people try the concept out: http://known.boffosocko.com/.

What are you waiting for? Your own follow button? You can have that too if you really want:

But you can at least allow people a choice in how and where you’re followed and read. Prefer to follow me via Email, Newsletter, Social Media, RSS, or even Push Notification? View all subscription methods here.

References

[1]
“Mastodon.social is an open-source Twitter competitor that’s growing like crazy,” The Verge, 04-Apr-2017. [Online]. Available: http://www.theverge.com/2017/4/4/15177856/mastodon-social-network-twitter-clone. [Accessed: 05-Apr-2017]
[2]
“Mastodon Is Like Twitter Without Nazis, So Why Are We Not Using It?,” Motherboard, 04-Apr-2017. [Online]. Available: https://motherboard.vice.com/en_us/article/mastodon-is-like-twitter-without-nazis-so-why-are-we-not-using-it. [Accessed: 05-Apr-2017]
Syndicated copies to: