twitterの「つぶやく」ボタンを好きな画像にする!

好きな画像でつぶやくボタンとFaceBookの「シェア」をしたかったのでメモ。

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

◆twitter
<a href="http://twitter.com/share?count=horizontal&amp;original_referer=ここにhttp://のアドレス&amp;text=ここにタイトル&amp;url=ここにhttp://のアドレス&amp;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>

これでOK!
参考はこちら▼
http://es.istgut.jp/tips/facebooktwittermixi.html

しかし、このままだとIEで小窓を出したときに、なんと「text=ここにタイトル」の部分で文字化け。
小窓がエラーで開いてしまった。

どうやら、日本語のエンコードがあっていない模様。
ということで、以下を付け加えてエンコード変更。

encodeURI(decodeURI(location.href))

で、こうなる

<a href="http://twitter.com/share?count=horizontal&amp;original_referer=ここにhttp://のアドレス&amp;text=ここにタイトル&amp;url=ここにhttp://のアドレス&amp;via=ここに自分のTwitterアカウント" onclick="window.open(encodeURI(decodeURI(this.href))
, ‘tweetwindow’, ‘width=550, height=450,personalbar=0,toolbar=0,scrollbars=1,resizable=1′); return false;"><img src="オリジナルのボタン" width="サイズ" height="サイズ" /></a>

これでOK★