2011年3月2日水曜日

Facebookの新コメントシステムをbloggerに設置

Facebookの新コメントシステムをてぃーだブログに
http://businessblog.ti-da.net/e3319511.html

How To Add Facebook Comment Box To Blogger Blogs
http://www.bloggermint.com/2010/05/how-to-add-facebook-comment-box-on-blogger-blogs/


<導入方法>

1.commentsにアクセスする
2.「URL to comment on」欄にブログURLを入力する
3.「Get Code」ボタンをクリックすると下記のようなコードが表示されるのでコピーする

      <div id="fb-root"></div>
      <script src="http://connect.facebook.net/en_US/all.js#appId=xxxxxxxxxxxx&amp;xfbml=1">
      </script><fb:comments href="http://fk2kurimon.blogspot.com/" num_posts="3" width="500">
      </fb:comments>

4.上記のコードをblogger向けに編集(例として下記コードのように編集)

      <b:if cond='data:blog.pageType == &quot;item&quot;'>
      <!-- X:S Facebook Comments -->
      <div id='fb-root'/>
      <script src='http://connect.facebook.net/en_US/all.js#appId=xxxxxxxxxxxxxxx&amp;xfbml=1'/>
      <fb:comments href='data:post.url'/>
      <!-- X:E Facebook Comments -->
      </b:if>



5.bloggerのデザイン変更でHTML編集(ウィジェットのHTMLも編集するにチェックを入れる)を開いて、上記のコードを追加。b:if~は個別ページの時に表示される条件分岐ですよ。

保存するとこのように表示されます。






この新Commentの何がすごいかって!


  • ブログのコメント欄にコメントすると通知がFacebookに行く
  • コメント返信も同様
  • Facebook側の通知から返信しようとするとブログのコメント欄にジャンプする


AppIDとブログを紐付ける点が肝となっているのかな。



ということは!

FacebookのCommentBox追加するにはAppIDが必要ということは、すでに作成済みのFacebookアプリが持っているAppIDでCommentBoxを追加できるってこと!!

[あとでFacebookアプリに反映する]

0 コメント: