Bridging this blog with the Fediverse

DezeStijn • • 4 mins read

Series: Joining the Fediverse

Intro

I recently joined the wave of people parting ways with Twitter/X and migrating to Bluesky.

While doing so, I investigated the options to bridge the multiple online accounts I already created, including the one on Mastodon. Doing so, I stumbled upon Bridgy Fed.

I’m far from an expert on the Fediverse. In this post I’ll share the steps I’ve taken (so far) to link my site to the Fediverse and how I optimized it moving forward.

Since I already created my Bluesky account prior to discovering this bridge, I did not bridge my Mastodon and Bluesky accounts. However, using Bridgy Fed this would also be possible.

Bridging my site to the Fediverse

Set up bridge

This step is by far the easiest.

On the Bridgy Fed website, enter your domain name and press Go.

Bridge website via Bridgy Fed
Start bridging

Bridgy Fed will set up accounts on ActivityPub (the Fediverse protocol used by Mastodon and others) as @[domain]@web.brid.gy and Bluesky as @[domain].web.brid.gy@bsky.app. So in my case, those accounts can be found at @sequr.be@web.brid.gy on ActivityPub and sequr.be.web.brid.gy on Bluesky.

Set own domain as Bluesky handle

This is something I did for my personal Bluesky account, but you could use it for you bridged website as well.

The documentation is easy to follow.

  1. Go back to the Bridgy Fed homepage and enter your domain name. This should bring you to your site’s profile page.
  2. Click on the tag button next to your Bluesky handle. This will copy your DID, your account’s unique identifier.
  3. Either use DNS verification or HTTPS verification to verify ownership of the domain.
  4. Validate your config.
  5. Click the refresh button on your profile page (see 1.).

Had I done this for my site’s bridged account, its Bluesky handle would have been sequr.be instead of sequr.be.web.brid.gy.

Set own domain as Fediverse handle

You can also use your own domain name for the instance, replacing the @web.brid.gy in your bridge accounts’ handle.

Sadly, since my site is hosted on GitHub pages, I cannot implement the redirects required to do so.

If you want to do this yourself, be sure to follow the documentation.

Optimizing my blog for the Fediverse

By default, Bridgy Fed will look at your site’s RSS or Atom feed to pull data from your posted articles.

However, using h-card and h-entry microformats, you can add metadata to your site which can be picked up by Bridgy Fed and other services.

Note
I started writing this blog post before I did the theme change post. In that post, I discuss adding microformats to this site.

A non-conclusive list of changes I made to the theme to achieve this:

  • Each post’s <article> tag now has the h-entry class, indicating this holds content that can be syndicated.
  • The post’s <main> content carries the e-content encapsulating the full content of the post.
  • The info section at the top of a post has an embedded h-card holding the author information in a p-author tagged span.
  • … and a bit more

I suggest looking at the specs to find out more about how to implement microformats on your site.

Getting feedback from the Fediverse

A next step for my site will be to incorporate Webmentions into my site.

“What are webmentions and why should I use it?”, you may ask…
Well, Indieweb answers this as follows:

Enables cross-site conversations. When you link to a website, you can send it a Webmention to notify it. If it supports Webmentions, then that website may display your post as a comment, like, or other response, and presto, you’re having a conversation from one site to another!

So each time you link to someone else’s blog, you’d send out a ping to their site. That ping contains a bit of context as to how you’re referencing them (mere link, a comment on their blog, a like, …). They can then use that info to display this on their site.
When someone else references your blog post, you can also receive this ping and use the same type of context on your site.

I haven’t quite figured out how to do the first part (sending out webmentions) in a static site context quite yet. For the 2nd part I’m planning to use Webmention.io as the “receiver”.

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

To use it, you need to login using RelMeAuth. So first you need to add a link to e.g. your GitHub profile with rel=me on your homepage, and link back from your GitHub profile to your site.

The receiving part it easy: you add a link tag to the head of your site, telling others to send their pings to the Webmention service.

<link rel="webmention" href="https://webmention.io/YOURDOMAIN/webmention" />

The hard part is pulling the received webmentions from Webmention.io’s API feed and adding them into a static website.

Feel free to DM or tag me on Bluesky, Mastodon or Twitter/X with suggestions on how to achieve this. You can try to get my attention via Webmention, but I’ll probably miss it ;)

I will keep you all posted when I have figured this out.