Twitterのタイムラインを埋め込んで表示させる方法

Twitterのタイムラインを表示させる方法です。ホームページのサイドバーとかにサイト運営者のTwitterが埋め込んであったりするやつですね。余計なものはバッサリ省いて使うとこだけ簡単に説明(メモ)してます。

Twitterのタイムラインコードを取得する

アプリのTwitterからではなくブラウザからWebサイトのほうのTwitterにログインします。

Twitterサイト https://twitter.com/

ログインした際の自分のTwitter URLを使用しますのでURLをコピーしておきます。

ユーザーの「設定とプライバシー」の「ウィジェット」を選択します。

「ウィジェット」の「新規作成」ボタンでどれか選択します。コードを取得するだけなのでどれでもいいです。

上記の画面になりましたら下にスクロールします。(最初、ここスクロール気づかなかった。)

「Embedded Timeline」を選択します。

ここで最初にコピーしておいたURLを入力します。

タイムラインのTwitterコードが表示されますので取得します。コード取得できたらTwitterは閉じてOK。

Twitterコードを貼り付ける

取得したTwitterコードをそのまま貼り付けるとこの時点でのツイート4件横幅いっぱいで全部表示されました。

上画では省略していますがずらずらとどこまで表示されるか分からないので縦のサイズは指定したほうが良いでしょうね。

高さは400pxにしてついでにツイート区切りの線の色を変更、ヘッダー部分、フッター部分もいらないかな。ということで貼り付けるコードを少し編集します。