忍者ブログ

Facebook シェア

Date:

Facebookシェアボタンを追加してみた。
イイネボタンというのがあって、Facebookではこちらを推奨しているみたい。
シェアボタンの追加方法の仕様を調べるのにちょっと苦労したので
リンクを残しておきます。

Facebook デベロッパーサイト


シェアボタンの配置は以下のURLに2つのパラメータを送付するのみ。
必要なその他の情報は、Facebook側が勝手にサイトのヘッダ情報を読んでくれます。

使用例:
Facebookでシェアする



http://www.facebook.com/sharer.php?u=<シェアしたいサイトのアドレス>&t=<タイトル>

ただこれをこのままリンクしてもダメなようで、
デベロッパーサイトによると、パラメータ(赤字の部分)を
URLエンコードをかけなければいけないらしい。
簡易にJavascriptでできる方法を紹介。
ついでに、ポップアップ画面で開くようにしてます。


<a href="javascript:void(window.open('http://www.facebook.com/sharer.php?u='+encodeURIComponent('http://<!--$g_user_id--><!--$entry_link-->')+'&t='+encodeURIComponent('<!--$entry_title-->'),'p_window','width=550,height=400, menubar=no, toolbar=no, scrollbars=no'));"><img src="ボタンの画像" border="0"></a>


緑字は忍者ブログ固有のタグです。
(記事のURL)
http://<!--$g_user_id--><!--$entry_link-->

(記事のタイトル)
<!--$entry_title-->


自動でヘッダ情報を正しく読み込んでくれるように、
og:title、og:descriptionというOpen Graphタグを埋め込む用に推奨されている。
ただ、指定がなくても、HTMLのタイトルタグや、メタタグを読み込んでくれるようで、
何も指定しなくても動作はするようです。
PR

Category: | Date:2011/01/15


忍者ブログ [PR]