
ブログやサイトの運営者は、ソーシャルネットワークのアカウントも利用している事が多いです。ソーシャルネットワークのアカウントから記事の投稿の案内や紹介を行ったり、TwitterやFacebookなどの投稿を記事に埋め込んだりする事も一般的です。
サイトとソーシャルネットワークアカウントの連携方法も様々な手法があります。パソコン表示画面のサイドバーやモバイル画面の記事下にソーシャルネットワークのタイムライン・ウィジェットを設置しているブログやサイトも比較的良く見ます。
目次 - Table of Contents
2023年7月以降 Twitter タイムラインウィジェットは動作しません
2023年6月の最終週からログインをしないとTwitterの投稿が見れない様になりました。当該変更によって、Twitterの投稿埋め込みが表示されない。GoogleのTwitter投稿のインデックス数が激減したり、これまで検索結果で表示されていたTwitter投稿のカルーセル表示も表示されなくなるなどの事象が発生したため、約1週間後から個別のツイート・投稿(単体のツイート)はTwitterにログインしない状態でも再び表示される様になりました。
しかし、この記事を書いている時点では、Twitterのアカウント・プロフィールページ(タイムライン)はログインしないと表示されません。そのため、サイトやブログに設置しているTwitterのタイムラインを表示するウィジェットも表示されなくなっています。
以下の画像の様に「通知はまだ届いていません」と表示されます。

Twitterのウィジェットツールのプレビューでも「通知はまだ届いていません」の表示になります。

将来、Twitterのタイムラインウィジェットが再び表示されるようになる可能性もありますが、現在のTwitterは予告なく仕様が変わったりする事も多く、一旦、表示されたとしてもまた表示されなくなる可能性もあります。このままタイムラインウィジェットは廃止になるかもしれません。
Twitter タイムラインウィジェットの代替候補
サイトに関連したFacebookアカウントも運用している場合、Facebookの投稿をタイムライン表示させるウィジェット(ページプラグイン)に入れ替えるのも有力な候補となります。
サイトやブログの運営者の場合、Facebookアカウントは持っていても、サイトやブログとは関連しない使い方をしている事も多いと思います。Facebookは、個人アカウントとは別にサイトやビジネスなどに適した「ページ」機能もあります。
Facebook、Twitter以外のSNS
InstagramやPinterestもブログやサイトに埋め込むウィジェットを提供しています。写真が中心のサイトの場合は、InstagramやPinterestとの相性も良いので有力な候補となります。
しかし、サイトがテキスト中心の場合は、テキスト主体のソーシャルネットワークの方が一般的には相性は良いです。
Threads、Bluesky、T2は現時点ではまだタイムラインウィジェットのサポートは行われていません。将来、サポートされる様になれば有力な候補になる可能性もあります。
Mastodonアカウントのタイムラインウィジェット
Mastodonの公式タイムラインウィジェットは提供されていませんが、いくつかのサードパーティが提供するタイムラインウィジェットが利用可能です。WordPressのプラグインもいくつかありますが、まだ完成度は低いです。
現時点で私が試した中では、Mastofeedが良いと思いました。

- インスタンスURL:Mastodonのインスタンス(サーバー)のURLを入力します。(例:mastodon.social, mstdn.jp 等)
- ユーザー名
- 幅(ピクセル):パソコンのサイドバーの幅に収まる値を入力します。一般的には300pxから400pxの間です。
- 高さ(ピクセル):ウィジェット(フィード)の高さをピクセルで入力します。一般的な目安としては600pxから800pxの間です。あまり場所をとりたくない場合は小さい数値を入力します。
- UIスケール(パーセント):特に縮小や拡大して表示したいなどがなければ、100%(実寸)で良いです。
- テーマ:ダーク、ライト、自動の中から選びます。
表示設定オプション
- ヘッダー(アカウント名とプロフィール)の表示の有無(デフォルトは表示)
- 返信の表示の有無(デフォルトは非表示)
- ブーストの表示の有無(デフォルトは非表示)
フィードの作成
必要事項を入力後、Generate(フィードを作成)のボタンを押します。フィード(ウィジェット)のHTMLのコードが生成され、画面下部にプレビューが表示されます。
HTMLコードをコピーする
プレビューを見て、特に問題なく表示されている様であれば、生成されたフィードウィジェットのHTMLコードをコピーします。

タイムラインフィード HTMLコードをサイトのサイドバーウィジェットに貼り付ける
サイトの管理画面のウィジェット設定ページを開き、サイドバーのウィジェットにコピーしたMastodonタイムラインフィードHTMLコードを貼り付けて保存します。

サイトを表示し、Mastodonのタイムラインウィジェットが表示されているか確認します。

プロフィールが表示された方が良いかどうかやウィジェットの幅や高さなどが適当かなどを確認し、必要であれば、ウィジェットの設定を変更して、コードを再生成します。
表示が特に問題なければ、作業は完了です。
コメントを残す(承認後表示されます)