サイトに「Mastodonで共有」ボタンを設置する。

PC版へ 2024年11月26日

前回、Bluesky のシェアボタンを作成してみたので、ついでに Mastodon のシェアボタンも設置してみる。

Mastodonは分散型のサービスです。なので、利用者によって登録しているサーバ(Mastodon用語ではインスタンスと言います)が異なるので、𝕏 (x.com) や Bluesky (bsky.app) のようにサーバのアドレスを一意に決め打ちすることができません。

「ユーザがどのインスタンスを利用しているか」をこっち側から窺い知る術はないので、インスタンスのアドレスを入力・選択してもらう、というひと手間をユーザにお願いする必要が出てきます。

それを踏まえて「Mastodonで共有」ボタンの設計方針をまとめると、

と、こんな感じの動作となる筈。

そんなわけで…

上のアイコンをクリック / タップすると、以下のようなポップアップダイアログが表示されます。

mstdn_share.png

で、インスタンス入力欄にあなたが利用しているインスタンスを入力して「投稿」ボタンをクリック / タップすると、Mastodonの投稿ページへ遷移します。

mstdn_share02.png

ブラウザからMastodonにログインしていない場合は、ログイン画面が表示されます。

作ってみた結果、上記のとおり、動作も見た目もほぼMastoshareになってしまった。

もしかしたら、このかたちが現状の最適解なのかもしれません。

外部サービスの利用を厭わない人は、素直にMastoshareをお使いになるのも手ですね。

もし、外部に頼らずに自分のサイト内で共有機能を完結させたい、ということであれば、うちのサイトで動いているスクリプト一式がこちらからダウンロードできます。zipを展開して、mstdn_share フォルダ内の index.html を読んでいただいて、設置方法などをご確認ください。

ということで、よろしくどうぞ。

関連記事

<<前の記事 | HOME | 次の記事>>

コメント

現在、コメント機能は停止しています。