Bloggerのソーシャルボタンをカスタマイズする （ShareThis編）

ちょくちょくBloggerのレイアウトやガジェットを弄っているので
すが、今回はソーシャルボタンをちょっと弄ってみます。

ソーシャルボタンって？

ココです。


投稿の下、コメント欄の上にあるんですがめっちゃ地味です。
弄るといっても今のところBloggerでは表示or非表示しか選択
できないので、別のサービスを導入するしかありません。

という事でPart1はShareThisという海外のサービスです。
簡単に複数のボタンをまとめて設置できるのでとても便利！


http://www.sharethis.com

『Get the code』をクリックします。　


コードを貼り付けるサービス（今回はBlogger）を選択します。


表示されるタイプを選択します。


表示されるプレビューを見ながら並び替えや表示させるサー
ビスの追加/削除を行い、『Get the code』をクリックします。　


アカウントの取得が嫌なら、右端をクリックします。


できたコードをコピーします。

これで貼り付けるコードの準備ができました、簡単でしょ？


では続いて貼り付け作業、レイアウトからガジェットの追加を
選択し、HTML/JavaScriptをクリックします。


貼り付けて保存したら完了、ガジェットがどこにあってもいいよ
うですが、私はココに移動しました。


名前を付けなければ何も表示はされないのですが、ガジェッ
トの位置に１行空欄ができるのが気持ち悪いので・・・

こんな感じで各投稿の下に自動的に表示されます。



・・・標準のボタンが邪魔なので消しましょうか。
レイアウトで『ブログの投稿』を編集で開き、『共有ボタンを表
示する』のチェックを外します。



なくなりました。



と・こ・ろ・が・・・

トップページで投稿の一覧が表示されているのですが、そこの
投稿下にも表示されてしまいます。
（標準の共有ボタンが復活してるのは編集の都合です）


まぁ我慢できないほどじゃないんですが何となく不細工です。
もともと標準の共有ボタンも同じように表示されてたので特に
問題ないのですが、ボタンが目立つようになった為違和感が
大きくなったんでしょうね。

何とか消せないかなぁと調べていたら、ふりむけばコウホウ
（yuki saijoさん）というブログに参考になる投稿を発見しました。

LinkWithinがトップページにも表示されてしまう時のBlogger対処方法

対象となるサービスは違うのですが、何となく同じ方法ででき
そうな気がするので早速試してみました。


まずは、レイアウトで貼り付けたコードに名前を付けます。


一時的なものなのでなんでもいいですが、他のガジェットと違
う名前にします。


テンプレートから『HTMLの編集』をクリックします。


注：よくわからない人は先にテンプレートの画面右上でバックアップを取得しておく事をおススメします！

clrl＋Fで検索窓を開き、さっき付けた名前（今回の場合は〝こ
こ〟）と入力しリターンを押すと目的の部分に飛びます。


左にある▼は畳んである印なのでクリックして広げます。


こんな風に２行追加します。


テキストで書くと、赤太字の部分をコピペで追加しています。

<b:if cond='data:blog.pageType == &quot;item&quot;'>
                                  <data:content/>
</b:if>


保存したら完了、トップページには表示されなくなりました。


特に不具合らしき問題も発生してないのでたぶんこの方法で
大丈夫だと思いますが、管理人は素人ですのでもし実行する
なら自己責任でお願いします・・・
なお、もしおかしくなったらさっき取得したバックアップを使って
元に戻す事ができますョ。


ブログ初心者のメモ帳は こちら です。


（トップ画像：www.socialbookmarkingicons.com）