【超簡単】Twitteの埋め込みをレスポンシブに対応する方法
Twitterのタイムラインの埋め込みコードを取得する
まずはここにアクセス
https://publish.twitter.com/
コピーしたコードを一部改変する
|
1 |
<a class="twitter-timeline" data-width="220" data-height="600" href="https://twitter.com/Twitter?ref_src=twsrc%5Etfw">Tweets by Twitter</a> <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script> |
「data-width=”220“」の「220」は先ほど設定した横幅の指定ですが、これを「100%」に変更します。
|
1 |
<a class="twitter-timeline" data-width="100%" data-height="600" href="https://twitter.com/Twitter?ref_src=twsrc%5Etfw">Tweets by Twitter</a> <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script> |
これがレスポンシブ対応の埋め込みコードです。
