https://webmention.io/



[webmention-logo-380]

Webmention.io

Webmention.io is a hosted service created to easily receive
webmentions on any web page.

You might also be interested in reading about this project
on the IndieWeb wiki.

Web Sign-In

[                    ] Sign in
 Use it on your site

Once you have signed up, add the following tags to your HTML,
replacing "username" with the username you got when you signed up:

    <link rel="webmention" href="https://webmention.io/username/webmention" />
    <link rel="pingback" href="https://webmention.io/username/xmlrpc" />

The system will begin collecting webmentions and pingbacks on your
behalf. Of course you can leave off the pingback endpoint if you'd
like.

Note that the "username" here will most likely be your domain. For
instance, if your domain is https://aaronparecki.com/, then your
username will be aaronparecki.com.

 Forward pingbacks to webmentions

If you want to accept pingbacks on your website but don't want to
deal with the hassle of XMLRPC, you can use this service to forward
pingbacks as webmentions to your server. You don't need an account
for this to work.

<link rel="pingback" href="https://webmention.io/webmention?forward=https://example.com/endpoint" />

For further details and an example, please refer to the README.

 Display a mention counter

You can use the API from Javascript to display a mention count of one
or more URLs.

Getting the data manually

To retrieve the data manually (via Fetch API, jQuery, raw XHR, etc.),
you can make a request like the following. Webmention.io sets
Access-Control-Allow-Origin: * in response headers, so you can query
from a browser as well as from a server.

fetch("https://webmention.io/api/count?target=https://example.com/page/100")
    .then(response => response.json())
    .then(responseJson => console.log(responseJson));

This will return a list of total mentions of the URL as well as
grouped by type.

{
  "count": 6,
  "type": {
    "bookmark": 1,
    "mention": 2,
    "rsvp-maybe": 1,
    "rsvp-no": 1,
    "rsvp-yes": 1
  }
}

Displaying counts automatically

You can include some simple markup and a Javascript file to
automatically display the mention counter for one or more URLs on a
page.

First, choose an element that will be used to display the counter.
Add the attribute data-webmention-count to it, as well as data-url=""
with the full URL of the page you would like to count. This might
look something like the following:

<span data-webmention-count data-url="https://example.com/page/100"></span> mentions

Then, add the following script tag to your page after you've included
jQuery:

<script type="text/javascript" src="https://webmention.io/js/mentions.js"></script>

 Show all mentions

You can also use the API to show all mentions of a URL. As with the
count request, this will work from a browser or you can use the API
directly from a server.

fetch("https://webmention.io/api/mentions.jf2?target=https://example.com/page/100")
    .then(response => response.json())
    .then(responseJson => console.log(responseJson);

Which will return data in this format:

{
  "type": "feed",
  "name": "Webmentions",
  "children": [
    {
      "type": "entry",
      "author": {
        "type": "card",
        "name": "Tantek Celik",
        "url": "http://tantek.com/",
        "photo": "http://tantek.com/logo.jpg"
      },
      "url": "http://tantek.com/2013/112/t2/milestone-show-indieweb-comments-h-entry-pingback",
      "published": "2013-04-22T15:03:00-07:00",
      "wm-received": "2013-04-25T17:09:33-07:00",
      "wm-id": 900,
      "content": {
        "text": "Another milestone: @eschnou automatically shows #indieweb comments with h-entry sent via pingback http://eschnou.com/entry/testing-indieweb-federation-with-waterpigscouk-aaronpareckicom-and--62-24908.html",
        "html": "Another milestone: <a href=\"https:\/\/twitter.com\/eschnou\">@eschnou<\/a> automatically shows #indieweb comments with h-entry sent via pingback <a href=\"http:\/\/eschnou.com\/entry\/testing-indieweb-federation-with-waterpigscouk-aaronpareckicom-and--62-24908.html\">http:\/\/eschnou.com\/entry\/testing-indieweb-federation-with-waterpigscouk-aaronpareckicom-and--62-24908.html<\/a>"
      }
      "mention-of": "https://indieweb.org/",
      "wm-property": "mention-of",
      "wm-private": false
    }
  ]
}

 More API Docs

You can read more information in the project's README file.

Open Source: github.com/aaronpk/webmention.io
Made by aaronpk
Read more: indieweb.org/webmention.io