Google +1 ボタンを設置しよー!プラスワンって読むねん!

Google plusone
ワンワンっ!Google プラスワンっ!

Google +1 ボタンって何?

2011年 6月 1日から Google から提供開始されたボタンです!(ソーシャルボタンと言って良いのかわからんかったw)

Google プロフィール

サイトやブログなどに表示されているこのボタンを押すと自分のプロフィールの「+1」のページに表示されることになります。今のところ何処と連動してるか把握していませんが、わかり次第追記したいと思います〜w
FaceBook の「いいね!」ボタンの感覚で使えば良いと思いますよ!

連動についての追記
Google +1 がどこと連動しているかについてわたし知っていましたw
Google Experimental Search で「+1 button」の項目を選んでいる状態で google.com から検索すると検索結果に表示されます!

この試験運用の機能は提供を終了させていただきました。

が、本日(2011年 6月 3日)試してみると上の様な状態で提供は終了してしまったみたいです。
検索結果に表示されるのはまだ先になってしまうのでしょうか〜!?

設置する側のメリット!

素人考えでも検索エンジン最大手の Google のサービスなので、サイトやブログのアクセス数増加に少なくとも関係があると思いますよね〜w
わたしも検索結果順位に大きく影響があるんじゃないかな?と期待はしています〜w

この+1ボタンは、ユーザーがクリックすることによってその記事が検索結果の上位に表示されるようになり、サイト運営者にメリットをもたらす仕組みです。+1ボタンを設置したコンテンツが多くなれば、サイト運営者のURLがGoogle検索で露出する機会も増えることになります。+1ボタンによる投票により、ユーザーが役立ったと考える記事がどれかを正確に知ることができ、サイト運営者が読者に喜ばれるコンテンツを判断する助けになります。

Google、ウェブサイト設置用「+1ボタン」を明日発表か―またも提携先から情報漏れ

TechCrunch の記事でもそうゆう内容が記載されていました!
何よりも押して貰えたら少なからずとも評価されたと思って嬉しくなりますよね!?

自サイトでの利用方法!

確か Google +1 のサービスが提供されるって話題になった時期、3月ぐらいかな?に、自サイトで設置して使いたい人は登録する必要があるってことだったので下のページで登録しておきました。

+1 your website
+1 your website – Google

サービスが開始された今、この登録する工程が必要か不明です〜w 実際にボタン設置してみてちゃんと動作してなかったり、利用出来ないのなら登録してみてくださいw

Google Webmaster Central: The +1 button code is ready for your site

登録すると「Google Webmaster Central: The +1 button code is ready for your site」って件名のメールが届きます〜w

Google +1 ボタンを使う!

そもそも Google アカウントが必要だとか、登録初期にはプロフィールに +1 のタブが表示されていないとか、サービスを利用するのによく分からない部分があります。かなりアバウトになりますけど、説明しておきますので目安にしてください。

Google アカウントを取得していないならまず取得する。
Google アカウント

Google プロフィールを作成していないのなら作成する。
→ https://profiles.google.com/Googleのアカウント名/about

Google プロフィールに「+1」もしくは「+1’s」のタブがない!
→ どうも +1 ボタンを押した時にはじめて利用開始になるみたいで、ボタンを押すと Google プロフィールに表示されるようになります。(+1の利用開始の設定はなさそう)

ボタン設置方法!

Google +1 your website
Google +1 your website

ボタン設置用のコードは上のページから発行出来るんですけど、英語でいまいち分かりにくいですよね〜w 英語苦手ですw
とりあえずは、自サイトに表示したいボタンの Size を選んで Language を「Japanese」を選べば OK だと思います〜w

追記:日本語ページもあったみたいですw
+1 ボタン – Google+ Platform — Google Developers

1
2
3
4
5
6
7
<!-- Place this tag in your head or just before your close body tag -->
<script type="text/javascript" src="http://apis.google.com/js/plusone.js">
{lang: 'ja'}
</script>
 
<!-- Place this tag where you want the +1 button to render -->
<g:plusone></g:plusone>

Standard (24px) と Japanese を選択するとこんなコードが発行されます!


↑ 表示するとこんな感じ!

2
3
4
<script type="text/javascript" src="http://apis.google.com/js/plusone.js">
{lang: 'ja'}
</script>

この部分を表示させたいHTMLファイルの </head> の前か、</body> の前に挿入してください。

7
<g:plusone></g:plusone>

そして、この部分をボタンの表示させたい場所に挿入してください。

7
<div class="g-plusone" data-size="standard" data-count="true"></div>

HTML5 だとこれで良いみたいです。

タグ内で指定出来るパラメーター

少ないですけど、指定出来るパラメーターも説明しておきます!

size
small、medium、tall のどれかを指定出来て、指定しない場合はデフォルトの Standard (24px) になります。

count
false のみ指定出来て、ない場合は true でカウンターが表示されます。

callback
JavaScript の関数を指定できます。クリックされた後に呼び出すことができるのかな?不明です〜w

href
+1 ボタンを押した時に登録される URL を指定できます。
指定がなかったら設置されている URL になるんじゃないでしょうか?w(憶測)

※ HTML5 だと上のパラメーター名の前に「data-」が必要みたいです。data-size とか。

 

7
<g:plusone size="small" count="false" callback="test" href="http://test.com"></g:plusone>

パラメーターを全部指定するとこんな感じ。

詳しくは Adding the +1 button to your site – +1 button API – Google Code を見てください!

WordPress に表示するなら!

2
3
4
<script type="text/javascript" src="http://apis.google.com/js/plusone.js">
{lang: 'ja'}
</script>

この部分を head.php の </head> の前か、footer.php の </body> の前に挿入してください。actyway では footer.php に挿入しています。(お使いの Theme により違う場合もあります。)

function google_plusone(){
?>
	<g:plusone size="medium" href="<?php the_permalink(); ?>"></g:plusone>
<?php
}

この部分を functions.php に挿入してください。(タグは好みで追加するなりしてください。)

<?php google_plusone(); ?>

single.php や index.php の表示したい部分に挿入してください。
他のソーシャルボタンと一緒に関数にまとめておいて使うのが便利ですよね〜w

Chrome の拡張機能!

せっかくサービスが提供されたので、どこでも +1 ボタンを押しまくりたいっ、そこのあなた!
Chrome だと素敵な +1 ボタンの拡張機能があります!!

plusone - Chrome ウェブストア

Chrome ウェブストア で「plusone」などで検索すると2個見つかります!どちらも非公式な物で入れてみると、なんだか残念な気分になれます〜w ちゃんと機能はしてますよ!(ちなみに昨日は1つしか公開されていませんでしたw)