Twitterのフォローボタンやタイムラインを表示させましょう！
Twitter連携の方法
はてなブログにはTwitter連携機能があります。連携すると記事の更新をフォロワーさんにお知らせできたり、はてなブログにフォローボタンを表示できたりします。
とてもお手軽にTwitter連携ができますので、その方法を紹介していきます。
まずはPCからはてなブログのダッシュボードにログインします。
ダッシュボードから左カラムの「アカウント設定」→「外部サービス連携」→「Twitter連携設定」とたどります。
Twitter連携していない状態では「有効にする」というボタンがありますので、クリックします。
そうするとTwitterとの連携確認の画面に移動しますので、連携アプリとして許可します。
連携アプリとして設定ができたらはてなブログの設定にも連携済みとして表示されますので、確認しておきましょう。
これでTwitterとの連携は完了です。連携したらせっかくなのでフォローボタンなんかを表示させましょう。
サイドバーにフォローボタンの追加
まずはサイドバーにフォローボタンを表示させてみましょう。ダッシュボードから「デザイン」→「カスタマイズ（スパナのマーク）」→「サイドバー」とリンクをたどります。
サイドバーメニューに「モジュールを追加」ボタンがありますのでクリックします。プロフィールタブにフォローボタンを表示するというチェックボックスがありますので、チェックを入れるとブログにフォローボタンが表示されるようになります。
チェックを入れた状態で「適用」をクリックすれば、サイドバーにTwitterのフォローボタンが表示されるようになります。
サイドバーにTwitterのフォローボタンが表示されましたね。
サイドバーにタイムラインを表示する
これだけだとちょっとさみしいので、タイムラインを表示させてみましょう。はてなブログにはタイムラインを表示させるために埋め込みリンクを使用します。
埋め込みリンクを作成するためにはTwitterのサービスを利用します。
このURLをクリックしてTwitterのサービスページに移動します。
自分のTwitterのプロファイルのURLを入力します。アカウント名ではないので注意してください。わたしの場合ではhttps://twitter.com/Isaragot_Imitisとなります。
そうするとどのようなボタンを配置するのかを聞かれるので左側の埋め込みタイムラインを選びます。
そうすると埋め込みリンクを表示してくれるので、「Copy Code」ボタンを押してリンクをコピーしておきましょう。
リンクをコピーしたらはてなブログのダッシュボードへ戻り「デザイン」→「カスタマイズ」→「サイドバー」とリンクをたどります。
ボタンを表示させたときと同じように「モジュールの追加」を追加をクリック、「HTML」ボタンを選択します。
上段のフォームには適当なタイトルをいれて、下段のフォームにはさっきコピーしたリンクをそのまま貼り付けます。
デフォルトだとかなり長いタイムラインが表示されてしまうので、適当な長さに調整します。
最初の<a>タグの最後に、data-tweet-limit=○（○には表示させるTweetの数を入れる）と入力します。わたしの場合は5つにしました。他にもCSSの記述が効くので、幅や高さを調整できます。
これでサイトにTwitterのタイムラインを表示させることができました。
SNS連携の効果
Twitter連携をすると、フォロワーさんの増加や記事の露出が期待できます。SNSのでの拡散はSEO的にも有利だとされています。
記事を書きながらでも1時間程度の作業で連携可能でしたので、Twitterをやっている人ならTwitter連携をしてみるのもいいでしょう。
ただし様々なモジュールを手当たりしだいに追加するのはやめておきましょう。たくさんモジュールを組み込むと、若干ページの読み込みが遅くなってしまいます。
