SNSボタンをオリジナル画像で設置する方法

Twitter

コードは以下になります。

<a href="http://twitter.com/share?count=horizontal&original_referer=ページのアドレス&text=ツイートさせたいテキスト&url=ページのアドレス&via=Twitterアカウント" onclick="window.open(this.href, 'tweetwindow', 'width=550, height=450,personalbar=0,toolbar=0,scrollbars=1,resizable=1′); return false;"><img src="オリジナルボタンのパス" width="サイズ" height="サイズ" /></a>

ツイートさせたくないもの（アカウントとか）があったら、消したい項目の&～を消せば大丈夫です。

Facebookシェア

コードは以下です。

<a href="http://www.facebook.com/share.php?u=ページのアドレス" onclick="window.open(this.href, 'window', 'width=550, height=450,personalbar=0,toolbar=0,scrollbars=1,resizable=1'); return false;"><img src="オリジナルボタンのパス" width="サイズ" height="サイズ" /></a>

ページのアドレスを入れるだけなのでシンプルです。

mixiチェック

コードはこちら

<a href="javascript:void(0);" onclick="window.open('http://mixi.jp/share.pl?u=ページのアドレス&k=mixiチェックキー','share',['width=632','height=456','location=yes','resizable=yes','toolbar=no','menubar=no','scrollbars=no','status=no'].join(','));"><img src="オリジナルボタンのパス" width="サイズ" height="サイズ" /></a>

こちらはアドレスの他にmixiのチェックキーが必要です。mixiで登録が必要ですので少し手間がかかります。

Google+

コードはこちら

<a href="javascript:(function(){window.open('https://plusone.google.com/_/+1/confirm?hl=ja&url='+encodeURIComponent(location.href)+'&title='+encodeURIComponent(document.title),'_blank');})();"><img src="オリジナルボタンのパス" width="サイズ" height="サイズ" /></a>

【追記】上記のコードでは動かなくなったようなのです。下記をお試し下さい。Google+ shareに変わったのでしょうか。

<a href="https://plus.google.com/share?url=ページのURL" onclick="javascript:window.open(this.href, '', 'menubar=no,toolbar=no,resizable=yes,scrollbars=yes,height=600,width=600');return false;"><img src="オリジナルボタンのパス" width="サイズ" height="サイズ" /></a>

Google+のボタンはこのような感じです。