使い方

手順
  1. Twitter Publish」でツイートのアドレスを入力する。あるいは、ツイート右上の3つドットが並んだアイコン をクリックし、メニューから「ツイートを埋め込む」を選択すると、該当するツイートが「Twitter Publish」で開く。
  2. 必要に応じて「Set Customization Options」リンクを押して、オプションを設定する。
  3. 「Copy Code」ボタンを押して埋め込みコードを取得する。
  4. サイトのソース内で、所望の位置に取得したコードを挿入する。

Twitter Publish

参考:

Twitter を埋め込む方法、タイムラインやツイートを Web サイトに表示 | マイナビニュース

ウェブサイトやブログにツイートを埋め込む方法 | Twitter ヘルプセンター [公式]

Embedded Tweets | Twitter Developer Platform [Official]

CMS Best Practices – Embedded Tweets | Twitter Developer Platform [Official]

タイムラインを埋め込む

手順
  1. Twitter Publish」でユーザープロファイルページのアドレスを入力する。
  2. 「Embedded Timeline」を選択する。
  3. 必要に応じて「Set Customization Options」リンクを押して、オプションを設定する。
  4. 「Copy Code」ボタンを押して埋め込みコードを取得する。
  5. サイトのソース内で、所望の位置に埋め込みコードを挿入する。

Twitter Publish

参考:

ユーザーのタイムラインを記事に埋め込む方法とカスタマイズ | ぼくらのハウツーノート

タイムラインの埋め込みとデザインカスタマイズの方法 | 創kenブログ

タイムラインを埋め込む方法 | Twitter ヘルプセンター [公式]

パラメータ

  • id
  • cards
  • conversation
  • theme
  • width
  • align
  • lang
  • dnt

参考:

タイムラインの埋め込みとデザインカスタマイズの方法 | 創kenブログ

Twitter を自分好みのデザインにカスタマイズして埋め込む方法 | after work lab

Embedded Tweet Parameter Reference | Twitter Developer Platform [Official]

ダークモードに対応させる

参考:

ツイッターの埋め込みでダークモードに自動対応させる裏技 | UNITORO

Change Embedded Tweet Dark Theme to Match Site | Luke Lowrey

Embedded Tweet Parameter Reference | Twitter Developer Platform [Official]

Embedded Tweets Night Mode – Twitter Developers Forums

Embedded Timeline Background Colour – Stack Overflow

横幅を調節する

  • data-width

参考:

Twitter 埋め込みサイズを変更/横幅を小さく中央寄せも | 大福日記

埋め込み時のカスタマイズ方法/レスポンシブ表示 | シロビジュ

スタイルを適用する

参考:

埋め込みツイートをカスタマイズ! CSS を変更する方法も | ぽんひろ.com

JavaScript

参考:

Embedded Tweet JavaScript Factory Function | Twitter Developer Platform [Official]

FAQ

参考:

FAQ – Embedded Tweets | Twitter Developer Platform [Official]

リンク

Twitter Publish [Official]

記事をシェアする:
タグ:

コメントを残す

メールアドレスが公開されることはありません。

Protected by reCAPTCHA