Google「+1」ボタンを設置した
当ブログHinemosuに、Googleの「+1」（プラスワン plusone）ボタンを設置しました。
本文上の ↑↑↑ ここらへん ↑↑↑ に「g+1」と書かれたボタンあるはずなので、みんな試しに押してみると良いよ！
Google「+1」ボタンの設置メモ
Google「+1」ボタンの設置は簡単でした。
「+1 Your Website – Google」にアクセスし、自分のサイトにあった設定を選べば、適切な設置用コードが生成されるようになっています。
ちなみにウチのブログ設定はこんな感じ。
で、生成されたコードはこんな感じ。
1 2 3 4 5 6 7 | <!-- このタグを head タグ内、または body 終了タグの直前に挿入してください --> {lang: 'ja'}</script><!-- このタグを +1 ボタンを表示する場所に挿入してください --><div class="g-plusone" data-size="medium"></div> |
生成されたコードに設置方法の説明も含まれているので、説明に従ってコードを挿入すれば作業は完了です。
ボタンの高さ合わせ
でまぁ設置は簡単だったけど、他のソーシャルボタンと高さ(水平位置)が合わなくて大変だった！
結論から言うと、g+1ボタンは自身が持つインライン・スタイルシートでiframeのmarginを0にしてるけど、その他のボタンはmarginを弄っていないので、その違いで水平方向の高さがズレてたみたい。
対策として、ソーシャル系ボタンのiframeは全て margin:0 としました。
原因が分かるまで地味に大変だったよ。