In your Mastodon profile, you can define up to four links individually. These links can be verified that they belong to you. So instead of using just plain links that look boring on your Mastodon profile, add them with the proper attribute to your website to get verified links.

Depending on your used client or Mastodon website, they may look different. But in general, they look something like this:

Verified links on the Mastodon profile

Since one usually links to your own website, you can get verified links by only adding a rel="me" attribute to the link to your Mastodon profile on your website. This attribute is part of the XHTML Friends Network (XFN), which has been created to categorize contact links. More information about this can be found on GMPG or in the WordPress Codex.

However, this XFN is only a part of what the rel attribute is capable of and is currently already used by practically every WordPress website without your knowledge. More information about the attribute itself can be found in the Mozilla Developer Network.

How to integrate it?

Usually, such social media links usually appear in a menu, mainly in the footer. So let’s look for a way to add the link relation to a menu item. First, go to Appearance > Menus and open the Screen Options on the upper right corner. There you can enable the “Link Relationship (XFN)” from the advanced menu properties.

Menu Screen Options

If you now add a new custom link to your menu, you can find a new input field for the link relationship (XFN) that can be used to add the required attribute to get a verification for your Mastodon links. Enter me as value to this input field.

Custom link with link relationship (XFN) in the menu

Save the menu and you’re done. As soon as you re-save your Mastodon profile that contains a link to your website where the shortly added link is visible, the link in your Mastodon profile will be marked as verified.

What about the navigation block?

Every link in the navigation block has an input field called “Link rel” in the link settings inside the block sidebar, which can be used to store the value me in it. So if you’re using the navigation block, it is similar to the menu area but with a different label.

Navigation menu link settings

And regular buttons, links and social media icons?

Fortunately for buttons, there is also a “Link rel” input field. However, it’s a bit hidden in the “Advanced” panel on the end of the block settings. From there, it works identical to the other input fields. The same applies to the social media icons since WordPress 6.2.

Button block advanced panel

For regular links inside regular text, this setting is unfortunately missing. An exception is made for the image block. If you click on the link icon in the block’s toolbar, you can change the view of the link settings by clicking on the chevron down icon on the right aside of the link input field. Then, a “Link rel” input appears.

However, you can edit a block with a text link as HTML via the toolbar menu and add the rel="me" attribute by yourself into the HTML if you know what you’re doing. This stays saved until you change the link itself via the toolbar, then it gets removed again. But until than, this is a working workaround.

Conclusion

A verified link in your Mastodon profile shows that you have control over the content on the linked website, so it creates trust to you. Since it’s not much effort needed in WordPress to add a link like this, I highly recommend it.

By the way: Epiphyt is also on Mastodon

Leave a Reply

Your email address will not be published. Required fields are marked *