【超簡単】Twitteの埋め込みをレスポンシブに対応する方法

0

Twitterのタイムラインの埋め込みコードを取得する

まずはここにアクセス
https://publish.twitter.com/

ここに埋め込みたいTwitterのURLを入力します。
表示させたいタイプを選びます。今回は最も一般的なタイムライン(真ん中)を選びました。

このままでは高さや横幅などが決められた通りの設定となってしまうので、「set customization options」をクリックします。
高さと幅を変更します。高さは適当に600(これはお好みで)としました。幅はいずれ変更するのですが、220以上である必要があるので220としました。数値を入れたら「Update」をクリックします。
「Copy Code」をクリックすると、埋め込み用のコードがコピーされます。

コピーしたコードを一部改変する

「data-width=”220“」の「220」は先ほど設定した横幅の指定ですが、これを「100%」に変更します。

これがレスポンシブ対応の埋め込みコードです。

コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

CAPTCHA