はじめに
この記事は自分のメモ的な感じで残しておきます。内容は余裕で既出だと思われます。
ユーザーにツイッターのリンクを入力してもらって、それを埋め込みにして使う方法を考えていた時のこと・・・
埋め込みの作り方
Twitterの埋め込みを作るときTwitter Publishというサイトを利用されると思います。
こちらの投稿を埋め込みするとき以下のようになります。
<blockquote class="twitter-tweet"><p lang="ja" dir="ltr">京都の春はこれで迎える！お外で食べる変わった「超ウマ行楽弁当」4選 <a href="https://t.co/K8v3VuyzI6">https://t.co/K8v3VuyzI6</a>
<a href="https://twitter.com/hashtag/getnews?src=hash&ref_src=twsrc%5Etfw">#getnews</a>
<a href="https://twitter.com/hashtag/%E3%82%AC%E3%82%B8%E3%82%A7%E3%83%83%E3%83%88%E9%80%9A%E4%BF%A1?src=hash&ref_src=twsrc%5Etfw">#ガジェット通信</a>
<a href="https://t.co/ql6xmaYMPv">pic.twitter.com/ql6xmaYMPv</a></p>— ガジェット通信（公式） (@getnewsfeed)
<a href="https://twitter.com/getnewsfeed/status/1504276600568705027?ref_src=twsrc%5Etfw">March 17, 2022</a>
</blockquote>
<script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>共有リンクは (https://twitter.com/getnewsfeed/status/1504276600568705027?s=20&t=PMAuAS1aFmWCxWFNcr05Dg) で、それらしきものは見つかりますが、上部にある文字列などが邪魔してくるためリンクだけを入力してもらっても埋め込みができないっぽいです。
わざわざサイトに行って作成するなんて面倒くさすぎる・・・
これじゃあユーザーにURLを入力してもらっても埋め込みに変換できないじゃないか！
Twitter Publishを使わない方法
それが・・・こちら！
<blockquote class="twitter-tweet">
<a href="埋め込みたいツイートのURL"></a>
</blockquote>
<script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>こちらの場合だと文字などを含んでいない埋め込みなのでURLだけで埋め込みが作成できます。
終わりに
実用性の低い記事だったと思いますが、自分と同じようなことをしようと思っている方がいると信じて記事を残しておきます！
また、私は最近Laravelを使っているので使うときはデータベースから送ってあげて
@foreach ($posts as $post)
@if($post->twitter_url != null)
<blockquote class="twitter-tweet">
<a href="{{ $post->twitter_url }}"></a>
</blockquote>
<script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>
@endif
@endforeachといった具合に書いてあげて一覧表示してあげたりして使っています。
参考文献
・にししふぁくとりー (https://www.nishishi.com/blog/2020/07/twitter_no_api.html)
・ガジェット通信 (https://twitter.com/getnewsfeed/status/1504276600568705027?s=20&t=PMAuAS1aFmWCxWFNcr05Dg)
