PLUS1WORLD

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+ で共有したい時に便利ですね。

追記

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

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

使ってみた例がこちら。

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