Create a "Share To Mastodon" Button for WordPress
Everyone0 is decamping from Twitter to Mastodon! The great thing about the Federated Internet (hereafter the "Fediverse") is that it is distributed. The bad thing is… it is distributed!
What do I mean by that? Here's an example of the problems with decentralised systems. If I want to create a link on a website which will share text to Twitter, I just create a URl which points to:
twitter.com/intent/tweet?text=https%3A%2F%2Fexample.com
The same is broadly true of any centralised system. Sure, the syntax differs, but you can use a URl like that to post to Facebook, WhatsApp, LinkedIn, etc.
But the Fediverse is different. I use the mastodon.social
instance, but you might be on fediverse.rocks
or lolcats.chat
. So we can't use a single URl to target all of them.
On the mobile web, the answer is simple. Just use the navigator.share()
Javascript function (and hope the user has an app installed). But for the desktop web, that just isn't available.
So, we need to use an intermediary. For this, I'm using Nikita Karamov's Toot Proxy.
A URl like: toot.kytta.dev/?text=Check%20out%20https%3A%2F%2Fexample.com
Will open a page like this: The user can then type in their preferred Mastodon address - for example
mastodon.social
- and get redirected to:mastodon.social/share?text=Check+out+https%3A%2F%2Fexample.com%2F
Magic!
Setting it up in WordPress
The WordPress Jetpack plugin defines a bunch of standard sharing buttons. You can add your own at your-blog.whatever/wp-admin/options-general.php?page=sharing
Clicking on "Add a new service" will bring up a prompt. You can fill it in like this:

- Service name
Mastodon
- Sharing URL
//toot.kytta.dev/?text=%post_title%%20%post_full_url%
- Icon URL
//edent.github.io/SuperTinyIcons/images/svg/mastodon.svg
You can choose your own icon, and edit the text you share.
Is this a problem?
The Fediverse is a complicated concept and, for better or worse, its structure doesn't lend itself to easily sharing content. Users have to remember which instance of each service they're on. That introduces cognitive overhead which just isn't present when choosing to share to the singular Facebook.
Is there a straightforward solution to this?1
How to add a Mastodon share button on GitHub, WordPress and Blogger – Blogpocket Social said on :
More comments on Mastodon.