Verifying Mastodon account with rel="me"

According to Mastodon it’s possible to verify one’s user page with insertion of rel="me" into a link on one’s site.

I tried inserting that rel="me" code into a link to my Mastodon account in my theme, but when I viewed the source code of the live site the rel="me" was effectively overridden by rel="noopener noreferrer" (as was present in every other link).

Is it therefore not possible to insert that rel="me", or is there perhaps something I’m missing?

1 Like

@mjw Do you have a suggestion here?

I added the following to social-links.hbs of my customized Dashi theme*:

<div class="social flex">

  ...

  <a class="social__item"
     href="https://mastodonapp.uk/@martinwebster" target="_blank" title="Mastodon"
     aria-label="Mastodon" rel="me">
    {{>icon name="mastodon" size="sm"}}
  </a>

  ...

</div>

Then I added this to feather-sprite.svg:

  <symbol role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" id="mastodon">
    <title>Mastodon</title>
    <path d="M23.193 7.88c0-5.207-3.411-6.733-3.411-6.733C18.062.357 15.108.025 12.041 0h-.076c-3.069.025-6.02.357-7.74 1.147 0 0-3.412 1.526-3.412 6.732 0 1.193-.023 2.619.015 4.13.124 5.092.934 10.11 5.641 11.355 2.17.574 4.034.695 5.536.612 2.722-.15 4.25-.972 4.25-.972l-.09-1.975s-1.945.613-4.13.54c-2.165-.075-4.449-.234-4.799-2.892a5.5 5.5 0 0 1-.048-.745s2.125.52 4.818.643c1.646.075 3.19-.097 4.758-.283 3.007-.359 5.625-2.212 5.954-3.905.517-2.665.475-6.508.475-6.508zm-4.024 6.709h-2.497v-6.12c0-1.29-.543-1.944-1.628-1.944-1.2 0-1.802.776-1.802 2.313v3.349h-2.484v-3.35c0-1.537-.602-2.313-1.802-2.313-1.085 0-1.628.655-1.628 1.945v6.119H4.831V8.285c0-1.29.328-2.314.987-3.07.68-.759 1.57-1.147 2.674-1.147 1.278 0 2.246.491 2.886 1.474L12 6.585l.622-1.043c.64-.983 1.608-1.474 2.886-1.474 1.104 0 1.994.388 2.674 1.146.658.757.986 1.781.986 3.07v6.305z"></path>
  </symbol>

*This is likely to be theme-specific, but it should point you in the right direction.

Edit:

For Journal theme, these are the required changes to default.hbs.

Add button after search:

<a class="gh-head-btn" href="https://mastodonapp.uk/@martinwebster" target="_blank" title="Mastodon" rel="me">
    {{> icons/mastodon}}
</a>     

Create ./partials/icons/mastodon.hbs:

<svg width="16" height="16" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M23.193 7.88c0-5.207-3.411-6.733-3.411-6.733C18.062.357 15.108.025 12.041 0h-.076c-3.069.025-6.02.357-7.74 1.147 0 0-3.412 1.526-3.412 6.732 0 1.193-.023 2.619.015 4.13.124 5.092.934 10.11 5.641 11.355 2.17.574 4.034.695 5.536.612 2.722-.15 4.25-.972 4.25-.972l-.09-1.975s-1.945.613-4.13.54c-2.165-.075-4.449-.234-4.799-2.892a5.5 5.5 0 0 1-.048-.745s2.125.52 4.818.643c1.646.075 3.19-.097 4.758-.283 3.007-.359 5.625-2.212 5.954-3.905.517-2.665.475-6.508.475-6.508zm-4.024 6.709h-2.497v-6.12c0-1.29-.543-1.944-1.628-1.944-1.2 0-1.802.776-1.802 2.313v3.349h-2.484v-3.35c0-1.537-.602-2.313-1.802-2.313-1.085 0-1.628.655-1.628 1.945v6.119H4.831V8.285c0-1.29.328-2.314.987-3.07.68-.759 1.57-1.147 2.674-1.147 1.278 0 2.246.491 2.886 1.474L12 6.585l.622-1.043c.64-.983 1.608-1.474 2.886-1.474 1.104 0 1.994.388 2.674 1.146.658.757.986 1.781.986 3.07v6.305z" fill="#888888"/>
</svg>
1 Like

My mistake. I actually had a script that was overriding the rel="me" with rel="noopener noreferrer", which has now been fixed.

Otherwise, if anybody out there would like to see the proper Mastodon docs page about link verification you can see it here:

1 Like