JavaScriptを使ってX(旧Twitter)のポストを自サイトに埋め込む方法

こんにちは、さるまりんです。

今回はJavaScriptとX(旧Twitter)の小ネタです。
このサイトでは記事のアップに合わせて、Xでもその公開をお知らせしています。
そのポストを自サイトに埋め込み表示する方法をメモとして残します。

埋め込むのは2024年11月24日のポストです。

1. Xの投稿ページで埋め込みたい投稿を見つけます。

2. 投稿の右上にある「…」アイコンから、メニュー「ポストを埋め込む」に進みます。
このメニューは環境やバージョンによって文言が違う可能性があります。

3. 表示されたページより、埋め込み形式を選択し

4. 「Copy Code」ボタンで埋め込み。

以下が取得されたコードです。

<blockquote class="twitter-tweet"><p lang="ja" dir="ltr">おはようございます<br><br>ちゃんと動いてるかな?<br><br>シンプルなWebサイトの稼働チェックスクリプトを作ってみました<a href="https://t.co/dJ3GSWiZrf">https://t.co/dJ3GSWiZrf</a></p>— さるまりん (@salumarine) <a href="https://twitter.com/salumarine/status/1860827096291098896?ref_src=twsrc%5Etfw">November 24, 2024</a></blockquote> <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>

下に実際に埋め込んでみました。

いろんなツールを使っていろんな表現を。
個性的なサイトを作ることができるように頑張りたいと思います。

読んでくださってありがとうございました。

それではまた!