2012-07-25

ソーシャルアイコンを変える

Bloggerデフォルトのソーシャルアイコンは、Google+1ボタン以外地味な印象。
なのでカスタマイズしてみることに。

忍者おまとめボタンというサービスを利用して簡単に設置できました。
忍者アカウントを作っとくと、ボタンがいろいろ選べるようになります。

やり方

  1. Blogger管理ページ → [レイアウト] → [ブログの投稿]を編集。
    デフォルトのボタンを消す。
  2. 忍者おまとめボタンで好きなデザインを選ぶ。
  3. 管理ページ → [テンプレート] → [HTMLの編集]
    「ウィジェットのテンプレートを展開」にチェック。
    検索で最初に出てくる
    <div class='post-footer'>
    
    の下に忍者おまとめコードを貼り付ける。
    (参考:Bloggerの記事下に設置するには…

で、3. についてなんですが、
自分の場合この方法だと記事下に妙に余白が空いてしまったので、
<div class='post-footer'>
コードたくさん....
</div>
とあるところの</div>の上に貼り付けました。
んでもって、CSSで余白なしに。
※ Chromeでスクロールバーが表示されてしまうようになったので消去。
div.ninja_onebutton{margin:0;padding:0;}
投稿場所の表示などをONにしてると使えないかもですが、とりあえずメモまで。

もっとカスタマイズしたい!という設置法は、こちらを参照。
Blogger にソーシャルボタンを設置する際に参考になったページとノウハウ

0 件のコメント: