概要：Bloggerの人気の投稿にツイート数を表示する方法
あなたは、下記のようなブログパーツをご覧になったことはありますでしょうか？
このブログパーツは、人気記事に「はてなブックマーク（はてブ）」が何個ついているか表示するものです。
⇒ ブログの人気記事を貼り付ける
実はコレに似せて、はてブの代わりに「ツイート数」を表示する方法があるのです。
これによって、あなたブログの人気記事に何個のツイートがあるのかを表示することができるわけです(^-^)
この方法を丁寧に解説しているのが下記のブログでした
かなりレベルが高いブログでビックリしました(＠_＠;)
非常に丁寧に書かれているので、書いている通りに実行すれば問題なくできるのですが、最近Bloggerの仕様が変わったことと、初心者の方がつまづきそうな箇所を補足したいと思い今回の記事を書くことにしました。
それでは、Bloggerの人気の投稿にツイート数を表示する方法をご紹介します(^-^)/
１．ガジェットの追加
まず、「人気の投稿」のガジェットを追加する必要があります。これをやらないと先に進めません(^_^;)）Bloggerにログイン→［レイアウト］ →［ガジェットを追加］→［人気の投稿］で追加します。
［表示］の箇所の設定は下記の４パターンがあります。
（１）抜粋/サムネイルなし
（２）抜粋のみ
（３）サムネイルのみ
（４）抜粋/サムネイル両方
今回は（１）を選択した例で進めていきます。
設定が終了したら［保存］を押します。
このガジェットを適当な場所へ配置したら［配置を保存］します。
２．テンプレートの編集
続いてテンプレートを編集します。まずは、バックアップを摂ります。
Bloggerにログイン→［テンプレート］ →［バックアップ/復元］→［テンプレートをすべてダウンロード］→［ファイルを保存する］→［OK］
以上ができたら、テンプレートの編集に入ります。
［テンプレート］→［HTMLの編集］→［テンプレートを編集］。
コードの中から「popular-posts」を見つけます。
「Ctrl+F」で「Search」を起動してpopular-postsを検索します。
続いて、<a expr:href='data:post.href'><data:post.title/></a>
の下に下記のコードを挿入します。
<div class='item-counter'><a expr:href='"http://tweetbuzz.jp/redirect?url=" + data:post.href'><img expr:src='"http://tools.tweetbuzz.jp/imgcount?url=" + data:post.href'/></a><a expr:href='"http://b.hatena.ne.jp/entry/" + data:post.href'> <img alt='はてブ' expr:src='"http://b.hatena.ne.jp/entry/image/" + data:post.href'/></a></div>※先ほど記載した通り、抜粋/サムネイルのありなしによって、（１）～（４）までのパターンがあります。コードの中にも（１）～（４）別にコードが記載されているので、パターンに応じた箇所に貼り付けましょう。面倒なら全部（４箇所）にコードを貼り付けてもOKです。
［テンプレートを保存］して終了です。
上手く行くと下記のように変更されます。
【ツイート数設定前】
【ツイート数設定後】
興味が沸いた方は是非導入もご検討してみてくださいね(^-^)/
●オススメ記事
⇒ 面白いカウンター「はてなブックマークカウンター」で「はてなブックマーク数」を表示
●参考記事
⇒ DevAchieve
スポンサードリンク
