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