ブログでなにかSNSとの連携が出来ないかなーと思っていたときに、このツイッターのタイムラインを表示しているのを見かけました。
これはぼくもやりたい!!と思ったぷぷんたは早速行動に移してみました。
表示させるためにコードを準備する
表示させるためにはツイッターのタイムラインを表示させるためのコードを作成しなければいけません!
コードを作成するといっても、自分で難しいコードを考えるのではなく、ツイッター側で用意してくれるものがあるのでそちらを使います。
IDがわかれば自分のツイートだけではなく、他の好きな人のツイートを表示することも可能です!
勝手に更新されるので便利ですよね。笑
まずは表示させたい人のツイッターアカウントをメモ
ツイッターアカウントとはこの赤枠の部分。

『 twitter.com/pupuntasan 』 ぷぷんたの場合はこれ。
なので、『 pupuntasan 』 の部分を表示させたい人のID名にすればOK。
このIDをメモしておきましょう。
表示用コードの作成方法
まずはこちらのサイトを開きましょう。ツイッター社が提供しているページになります。
サイトリンク:https://publish.twitter.com/#
表示されると真ん中にアカウントを入力する欄があるので、こちらに先ほどメモしたアカウントを入力します。

次の画面では左側の 『 Embedded Timeline(埋め込みタイムライン) 』 を選択しましょう。

ちなみに右側の『 Twitter Buttons 』を選択するとフォローボタンが作れるようになります。
次に表示用コードの設定を行うためにこちらをクリック。

こんな感じで詳細を設定する項目が表示されます。

各項目についての説明がこちら。
① Height(px):タイムライン表示枠の高さ
ツイートを表示させるための枠の高さを設定します。
ぷぷんたらいふでは500で設定しています。
② Width(px):タイムライン表示枠の横幅
ツイートを表示させるための枠の横幅を設定します。
ぷぷんたらいふではこちらも500で設定しています。
①も②もそれぞれ試してみてあなた好みのサイズを探してみるとよいでしょう!
③ How would you like this to look? :見た目の設定
実際に選択してみるとすぐにわかりますが、表示させるタイムラインの見た目を白か黒かに設定する項目です。
左:Light 右:Dark

印象が全然違うのであなたのサイトに合った方を選択してみてください!
④ What language would you like to display this in? :表示言語の設定
このページを見ている人に合わせて言語を設定したいのならその国に合わせてもいいとは思いますが、基本的には自動で設定してくれる 『 Automatic 』で大丈夫でしょう。
⑤Opt-out of tailoring Twitter :ツイッターのトラッキング設定
結論からいうと設定は不要かと思います。
チェックするとどうなるかというと、いわゆるオプトアウト(Twitter社に個人の情報を利用しても大丈夫ですよと了承すること)を許可しますというふうになります。
どんなページを見ているかや、どんな検索をしているのかというような情報がTwitter社に渡るというわけですね。
その情報を使ってサービスをより向上させていくためのもののようです。
詳しくはわかりませんが。笑
なので基本はチェック不要ですがお好みでチェックしたいかたはどうぞ。
全て設定出来たら最後に『 Update 』をクリックして設定完了!!
最後に『 Developer Agreement(使用承諾) 』と『 Developer Policy(開発者ポリシー) 』を確認して、『 Copy Code 』と書かれたボタンを押すと、表示用のコードがコピーされます。
表示用のコードを貼り付けて完了
あとはコピーした表示用コードを、ウィジェットの設定で自分好みの場所にカスタムHTMLにて入力すればOK!!
ぼくの場合は記事一覧下ウィジェットに設定したので、こんな感じになりました。

段落
これでまたちょぴっとぷぷんたらいふが充実したのであった。
ブロガーAmazonプライムのアフィリエイトをやってみよう!!とAmazonアソシエイトの審査をしてみようと思ったものの、審査が厳しいということを知り、直接『Amazonアソシエイト』ではなく『もしもアフィリエイト』を介して[…]