DEV Community

Cover image for What is a webmention and how do I use it in WordPress?
hagengraf for IONOS

Posted on

What is a webmention and how do I use it in WordPress?

Especially on the World Wide Web, linking content is one of the most powerful features. Even today, for search engines, the amount of links pointing to a website is one of the most important parameters that tells how popular that website is.

Unfortunately, when you place a link to another website, the other site, i.e. where the link goes, usually doesn't find out about it.

The W3C took care of the matter and in 2017 created a protocol called Webmention. Webmention is a way to automatically notify any URL when a link to it is placed on a website. From the receiving website's perspective, it's a way to receive notification when other websites link to it.

Sounds complicated, but it's quite simple, very practical and popular in social media systems. In many short message and messenger systems there is the possibility to prefix the name of a person with the @ sign and thus "mentions" the person. The person mentioned then receives a notice in the corresponding system that their name has been mentioned and a link to view the "Mention".

So a "Mention" is a notification when a certain event occurs. A "Webmention" then refers more specifically to events on the World Wide Web, such as a mention of a URL (link), an update of a content or even a "Like".

The WordPress Webmention Plugin by Matthias Pfefferle provides the base for this functionality.

To work with Webmentions, you need at least one sender and one receiver. Both need to understand the Webmention protocol.

So you need the functionality in your own WordPress installation and the receiving site in their system. This can be any system that can handle the Webmention protocol, so it doesn't have to be WordPress.

On your site you need to install and activate the Webmention and Semantic linkbacks plugin.

You can easily see if everything works after activation. Write a blog post with a link and look in the HTML source code if the link is mentioned as Webmention.

<link rel="webmention" href="https://hagen.cocoate.com/wp-json/webmention/1.0/endpoint">
<link rel="http://webmention.org/" href="https://hagen.cocoate.com/wp-json/webmention/1.0/endpoint">

Enter fullscreen mode Exit fullscreen mode

So how does it work?

The good news is: it works automatically 🙂.

Perhaps the easiest way to understand it better is to look at an example:
On my private blog in this blog post (https://hagen.cocoate.com/2022/01/21/webmention-test/), I linked to a post from another blog (https://blog.novatrend.ch/2022/01/10/hello-dolly-oder-wie-schreibe-ich-ein-wordpress-plugin/) .

When I save the post on my blog, the other blog receives a notification via the Webmention plugin, which is also installed on the other blog. The "mention" creates a WordPress comment on the receiving Novatrend blog.

Image description

The comment is semantically not a comment of course, but a mention (webmention) on another blog and therefore after the comment is approved, either a link or an avatar is simply displayed under the mentions heading (English mentions = German Erwähnungen). You can choose in the settings of the webmention plugin weather you want to display a link or an avatar.

This is how it looks on the other blog. Meanwhile, there are two mentions

Image description

So now both pages are linked and a visitor can see the mentions for himself. This is, compared to a search engine result a significant advantage for the site visitor.

Conclusion

From this simple principle, very interesting applications can be created through networking. I'm thinking of timelines, news threads and the like.

If before the linking was only in one direction, with the Webmention plugin it is in both directions. The linked website/person automatically learns about all links and can easily contact the other side.

Try it :)

Top comments (2)

Collapse
 
slaffik profile image
Slava Abakumov

You can do the same thing in WordPress for ages already, using the built-in pingbacks and trackbacks. No plugin needed. That’s effectively the same thing.

Collapse
 
pfefferle profile image
Matthias Pfefferle

Not exactly... The presentation of Pingbacks and Trackbacks is very messy and both does not support different types of responses... Webmentions are using Web-Semantics to check the type of resonse (like, repost, share, comment, ...) and to display the correct response-text...

So... yes Webmentions have a similar functionality but they are way more modern than Pingbacks/Trackbacks...