Blogger に google の "+1" ボタン を 設置、追加する方法を記載します。 各ページ (投稿) に対する ボタン です。 ここに載せる コード は ブログ テンプレート に対してコピペ で使えるようにしてあります。 表示したい位置へ コピー & ペースト して利用してください。 作業手順手としては次の通りです。
※その他の ソーシャルボタン もまとめて追加する方法は こちら。
※ソースコード は ダブルクリック すると、全選択できます。
google +1 ボタン の 設置手順
- マイブログ から [テンプレート] → [HTML の編集] を選択します。
- google API スクリプト を読み込む以下の ソースコード を
body
終了タグ の直前に コピー & ペースト します。
123456789<script type='text/javascript'>
window.___gcfg = {lang:
'ja'
};
(
function
() {
var
po = document.createElement(
'script'
); po.type =
'text/javascript'
; po.async =
true
;
var
s = document.getElementsByTagName(
'script'
)[0]; s.parentNode.insertBefore(po, s);
})();
</script>
- 以下から好きな表示形式を選んで、テンプレート の任意の表示したい場所へ ソースコード を コピー & ペースト します。
テンプレート編集 をしている 以下の画像の場合、投稿記事タイトル の直後に配置するようにしています。
ボタン のみ表示
1<
div
class
=
'g-plusone'
data-annotation
=
'none'
data-width
=
'300'
data-size
=
'medium'
expr:data-href
=
'data:post.url'
></
div
>
ボタン カウント 表示
1<
div
class
=
'g-plusone'
data-annotation
=
'bubble'
data-width
=
'300'
data-size
=
'medium'
expr:data-href
=
'data:post.url'
></
div
>
縦 カウント 表示
1<
div
class
=
'g-plusone'
data-annotation
=
'bubble'
data-width
=
'300'
data-size
=
'tall'
expr:data-href
=
'data:post.url'
></
div
>
今回、以下のサイトを参考にしました。
最後に… このブログに興味を持っていただけた方は、 ぜひ 「Facebookページ に いいね!」または 「Twitter の フォロー」 お願いします!!