Verifying your GitHub profile on Mastodon

Mastodon has a really neat way of implementing verification, using the rel=me microformat.

You can edit your Mastodon profile and add up to four links to it. Mine looks like this at the moment:

The verification checkmark can be had by embedding a link BACK to your Mastodon profile on another site.

My https://simonwillison.net/ and https://til.simonwillison.net/ page headers include the following HTML:

<link href="https://fedi.simonwillison.net/@simon" rel="me">

Getting a verified link to GitHub is a tiny bit trickier. GitHub does support rel=me - but only for one of the link fields in your profile:

The only field here that will have rel=me applied to it when GitHub serves the final page is that link field, which I have set to my personal blog at https://simonwillison.net/

So the easiest way to verify your GitHub profile is to point the link to your Mastodon page, which in my case is https://fedi.simonwillison.net/@simon

But... I didn't want to sacrifice that field! I want to link to my blog.

The first thing I tried was editing my profile to point to Mastodon, then editing my Mastodon profile to trigger a verification job, then editing my GitHub profile back again.

This looked like it worked, at least for my own personal Mastodon server. But it turns out other people visiting my profile wouldn't see the verified checkmark, because each Mastodon server runs its own verification checks - and their server was checking after I had reverted the change I had made.

Angus Hollands suggested a neat fix: use a GitHub Pages domain instead.

GitHub reserves https://your-username.github.io/ as a URL that you can create your own static GitHub Pages site on.

The way you do this is to create a repository called github.com/your-username/your-username.github.io - any HTML you put in that repo will be served from your personal domain.

Angus pointed out that since GitHub restrict who can publish there, proving ownership of simonw.github.io is equivalent to proving ownership of github.com/simonw.

So I did that instead! I set up https://simonw.github.io/ to be a page that served the rel=me link AND redirected to my https://github.com/simonw profile.

Here's the HTML I used to make that happen:

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
    <title>Redirecting to github.com/simonw/</title>
    <meta http-equiv="refresh" content="0; URL=https://github.com/simonw">
    <link href="https://github.com/simonw" rel="me">
    <link href="https://simonwillison.net/" rel="me">
    <link href="https://fedi.simonwillison.net/@simon" rel="me">
  </head>
  <body style="margin: 0; padding: 0">
    <a
      href="https://github.com/simonw"
      style="
        display: block;
        height: 100vh;
        width: 100vw;
        margin: 0;
        padding: 0;
        color: white;
      "
    >
      github.com/simonw
    </a>
  </body>
</html>

The key pieces here are that <link href="https://fedi.simonwillison.net/@simon" rel="me"> element to verify my Mastodon profile, and the <meta http-equiv="refresh" content="0; URL=https://github.com/simonw"> to implement the redirect.

GitHub Pages doesn't allow you to use real server-side redirects, so this <meta> tag is the next best thing.

It's completely unneccessary, but I decided to make the page itself a huge clickable link element which would redirect to the right place, using height: 100vh and width: 100vw to fill the page and setting the text to be white on a white background to keep it invisible for the split second before the redirect happens.

Created 2022-11-16T13:37:15-08:00, updated 2022-11-22T10:38:41-08:00 · History · Edit

Verifying your GitHub profile on Mastodon

Related