雑記ブログをやってみる-ひげしげノート

雑記ブログです。日記的なもの、興味のあるもの、買ったもののレビューとか書いたり書かなかったり。

はてなブログの複数ブログにツイッターのフォローボタンを設置する方法。

普通なら、はてなブログの管理画面から

「アカウント設定」 → 「外部連携サービス」 → 「Twitter連携設定」

でTwitter連携を有効にすれば問題ありません。

 

こんな風にプロフィール欄に自動的に設置してくれます。

f:id:higeshige:20180912235049p:plain

 

ところがはてなブログの「複数ブログ」の場合、アカウント自体は1つしかなく、ツイッターのアカウントも1つしか登録できません

 

なので例えば追加でブログを作って、そこに別のツイッターアカウントを載せたい場合はこの方法ではできません。

 

ツイッターが青いボタンを作ってくれる

「自分のウェブサイトにTwitterボタンを追加する方法」としてツイッター自身でウィジェットを作ってくれるサイトを用意しています。

 

専用サイトにGO

このサイトにまずは向かいましょう。

https://publish.twitter.com/

 

すると画面中央に窓とプルダウンメニューが出てきます。

ここはプルダウンメニューを無視して自分がボタンを作りたいツイッターアカウントを入力します。

 

私の場合だったら @higeshige_note と入力。

 

プルダウンメニューから選ぶとそこに書かれてある例のアカウント「@TwitterDev」がそのまま載ってきて次のステップに進んでしまいます。

f:id:higeshige:20180913002623j:plain

 

どんな表示形式にするか選びます。

f:id:higeshige:20180913002745p:plain

今回は右のボタンタイプ。

どんな種類のボタンにするか選びます。

f:id:higeshige:20180913003603j:plain

今回は左のフォローボタン。

コードが出来上がるので右の青いボタンを押してコピー完了!

f:id:higeshige:20180913004141j:plain

 

最後ははてなブログの管理画面に戻って、

「デザイン」 → 「カスタマイズ」 → 「サイドバー」

 → 「プロフィール」 → 「編集」

と進むと下の画像にたどり着きます。

f:id:higeshige:20180913004952j:plain

「ブログの説明」のところに先ほどコピーしたコードをペーストします。

左下の「適用」ボタンを押します。

 

最後にこの「変更を保存する」ボタンを押すのを忘れずに。

f:id:higeshige:20180913005737p:plain

 

これで無事に設置できました!

「読者になる」ボタンより上側にきますのでそこだけは留意してくださいね。

 

f:id:higeshige:20180913010121p:plain

 

では!