Xの投稿を埋め込む方法
公式の埋め込み機能を使う場合
サイトに埋め込みたい投稿の右上にある「…」をクリック。
![](https://vaniraflavor.com/wp-content/uploads/2024/03/embed-post-x-bsky_001.png)
「ポストを埋め込む」をクリック。
![](https://vaniraflavor.com/wp-content/uploads/2024/03/embed-post-x-bsky_002.png)
オプションを選択します。
投稿を埋め込むだけなら「Embedded Post」を選んでおけば大丈夫です。
![](https://vaniraflavor.com/wp-content/uploads/2024/03/embed-post-x-bsky_003-800x313.png)
「Embedded Video」では文章を省いて動画だけを埋め込むことが出来ます。
![](https://vaniraflavor.com/wp-content/uploads/2024/03/embed-post-x-bsky_004-800x417.png)
埋め込み用コードが生成されるので「Copy Code」をクリック。
![](https://vaniraflavor.com/wp-content/uploads/2024/03/embed-post-x-bsky_005-800x667.png)
あとはWordPressのカスタムHTMLブロックにコードを貼り付ければ完了です。
![](https://vaniraflavor.com/wp-content/uploads/2024/03/embed-post-x-bsky_006-800x256.png)
食べる牧場ミルクの棒可愛すぎる pic.twitter.com/UUJkGaNdOd
— バニラ(`・ω・´) (@MaxVanillatte) March 1, 2024
Cocoonを使用している場合
Cocoonを使っている場合はTwitterブロックにURLを張り付けるだけでもOK。
![](https://vaniraflavor.com/wp-content/uploads/2024/03/embed-post-x-bsky_007-800x231.png)
Blueskyの投稿を埋め込む方法
記事作成時点ではBlueskyには埋め込みコードの生成機能はありません。
公式ではないのですが、有志の方が公開しているサービスを使えば投稿の埋め込みが出来るようです。
いくつか種類がありますが今回は「Embed Bluesky」を紹介します。
使い方はとても簡単。
Embed Blueskyのサイトを開きます。
![](https://vaniraflavor.com/wp-content/uploads/2024/03/embed-post-x-bsky_008-800x748.png)
埋め込みたい投稿のURLを入力したら「Create Snipplet」ボタンをクリック。
埋め込み用のコードが生成されるのでコピーして、あとはカスタムHTMLブロックに張り付ければOK。
![](https://vaniraflavor.com/wp-content/uploads/2024/03/embed-post-x-bsky_009-800x1040.png)
※エディター上でプレビューすると表示がおかしくなることがありますが、投稿後の記事では正常に表示されていると思います。
![](https://vaniraflavor.com/wp-content/uploads/2024/03/embed-post-x-bsky_010-800x384.png)
まとめ
WordPressブログにX・Blueskyの投稿を埋め込みたい時はそれぞれ以下の方法が使えます。
Xの場合
- 公式の埋め込みコード生成機能を使用する
- Twitterブロックを使用する(Cocoonを使っている場合)
Blueskyの場合
- 「Embed Bluesky」などの有志が作成したサービスを使用する(非公式)
Blueskyの方は非公式のやり方になるため、使用する場合は自己責任でお願いします。
一番いいのは公式で埋め込みの機能を実装してくれることなんですが、しばらくの間は外部のサービスを使用するしかなさそうですね。
おわり!
コメント