Google+自作共有ボタンを設置するJavaScriptコード

2012年3月14日Google+Google+,JavaScript,ボタン

著者: 今井 阿見

google-plus-share-button-code-0031

皆さん、こんにちはGoogle+で様々なものを共有していますか?

先日、Google+ 上で今見ているページをGoogle+ に共有できるブックマークレットの作り方がひっそりと共有されていました。

https://plus.google.com/u/0/115459243651688775505/posts/ACThJkDDM9r

このJavaScriptのコードを使えばGoogle+に共有するためのボタンを自分のウェブサイトに設置できそうなのでやってみました。

Google+ 自作共有ボタンの設置

まずは、ボタンの画像を作っておきましょう。

作った画像をどこかにアップロードして画像のURLを取得しておきます。

あとは、ウェブサイトにコードを貼り付けます。

<a href="javascript:(function()%7Bwindow.open('https%3A//plus.google.com/share?url=’+encodeURIComponent(location.href),",’width=XXX,height=YYY,scrollbars=no’)%7D)();"> <img alt="G+ Share" src="http://www.plus1world.com/ここに画像のURL" /> </a>

width=XXXXXXの部分に開くウィンドウの横幅,height=YYYYYYの部分に開くウィンドウの高さを設定して下さい。

src="ここに画像のURL"の部分に先ほどのボタン用に作った画像のURLを入れて下さい。

あとの、細かい部分はそれぞれのサイトに合わせて設定して下さい。簡単に設置できると思います。

なお、このボタンはJavaScriptで動いているため、JavaScript無効になっている場合は動作しません。

当ブログでは記事の下の方に設置してみました。

こういったボタンを置いておくと、既に+1した記事も共有しやすくなります、Google+ で共有したい時に便利ですね。

追記

以下のURLでGoogle+公式の共有ボタンが提供されました

https://developers.google.com/+/plugins/share/?hl=ja

お好きな方を使ってください。

この記事を書いた人

著者(今井阿見)画像

今井阿見

当ブログ『PLUS1WORLD』の記事執筆、編集、校正、プログラミング(一部)、管理を行っているのは今井阿見(いまいあみ)という個人のブロガーです。ブログは趣味と実益を兼ねて運営しています。

今井阿見は30年近くゲームを遊んでいるベテランのゲーマー。学生時代にゲーム作りや映像制作を行っていたので、ゲームだけでなく、映画やアニメなどの映像作品、スマートフォンやパソコン、ガジェットなどの分野にも深く関心があります。

このブログ記事を気に入ったら著者(今井阿見)を応援して下さい! 励みになります!

著者Twitterアカウント 著者YouTube