Skip to content

2011年3月2日

15

Facebookの新しいコメントシステムをWordPressで使ってみた

Facebook Comment Box

米国時間の2011年3月1日。Facebookは外部のブログやウェブサイト向けに新コメントシステムを公開した。

機能詳細はこの記事で紹介されている通り。要するにブログとfacebook双方でコメントを共有できるということ。しかも単に「表示」するだけでなく、ブログ、facebookどちらから投稿してもお互い同じ内容が反映されるというものだ。
フィードでそんなニュースを見かけて、これはまさにこの1、2週間あれこれ試していたfacebookとwordpressとの連携に大いに役立つんじゃないかと思い、ちょっと試してみることにした。

手順としては

  • facebook developersからアプリを追加する(この仕組み、私自身まだよく理解できていない)
    • facebookにログイン
    • 画面上部青帯にある検索窓に”developer”とか入れると「グループ」に”Facebook Developers(開発者)”が表示されるのでここへ移動
    • “+Set Up New App”を押してアプリケーション追加画面を開く
    • 適当なアプリケーション名をつけて「アプリケーションを作成」
    • とりあえずここまででこの手続きは終わり

    このグループ内にある開発者のブログに今回のシステムの詳細が書かれているのでサラッと読んでおくと良いかも(英語だけど)。

  • 同じく「開発者」のページ内。参考資料＞Core Concepts＞Social Pluginsのページから “Comments” を選択する。
  • “URL to comment on” にコメント欄を貼りたい記事のURLを入力する。
  • Get Codeを押して生成されたコードを記事に貼付ける。

「コードを1行追加するだけ」との謳い文句の通り、これだけでfacebookとブログ記事で双方向のコメントのやり取りが可能になる。しかも双方向ともに瞬時に反映される(ブログ側にはfacebookの窓を表示してるだけなのでまぁ当たり前ではあるのだが)。

さて、これで個々のページがfacebookと連携されるのだが。

ちょっと待った！

記事を作るたびにいちいちその記事のURLを持っていってコードを生成して貼付けるなんてことは面倒極まりないし便利でもなんでもない。
で、ここから先はwordpressでこのシステムを使う場合の話。

ここから先…と言っても方法は至って簡単。

先ほど手順の最終ステップで生成した「コード」。これをちょこっと書き直して個別ページのテンプレート(使っているテーマ内のsingle.php)に貼り付けるだけでよいのだ。

具体的にはコード内に出てくる

を

または

に書き換えればよし。書き換えたコード全体をテンプレート内の好きな位置(大抵は＜?php the_content(); ?＞の下あたり)に貼付ければ実装完了である。

で、実際の動作だが…これがかなり面白い。

wordpressでコメントするとfacebookのwallに、facebook側からこのコメントに返信するとちゃんとwordpress側に反映されている。しかも瞬時。
　

この「瞬時に共有」機能はコメントシステムがfacebook側で完結しているが故なのだ。

じゃぁこのシステムが諸手を上げて歓迎できるものなのか…と言われれば、実はそうでもない。まだ始まったばかりであれこれ言うのは早計だとわかっていて敢えて不満というか心配な点を書き出してみる。

  • コメントがwordpress側に残らないということはこのサービスが終わったと同時にこれを使って入力されたコメントは消し飛んでしまうということだ。仮にデータをどこかにダンプできたとしても記事とコメントを手動で関連づけするのはほぼ不可能だと思われる。
  • facebookのアカウントしか使えない。twitterやgoogleが使えればいいのだが…互いにライバル的存在になるので、そう簡単でもないようだ。あくまで閉じたSocialである。それなのに…
  • wordpress側で個人名が晒されてしまう。facebook内ならプライバシー設定にさえ気をつければ写真や経歴がfriend以外に出てしまうことは無いのだが、一番問題なのは名前の横に「勤務先」や「居住地」などが表示されてしまうのだ。どこかで非表示設定できるのだろうか？
  • Developer視線では “its going to be incomplete and buggy – the GRAPH API is sill missing core features of the REST API after over a year. (Wordbookerの作者コメント)”という悲観的な見方もあるようだ。

まぁこれに限らずfacebookのAPI使ったアプリってな〜んか動作がアレで…という感想はずっと持っているのだが。ここのところ勢いのあるFacebook。しばらくはユーザーの要望を聞いて改善するモチベーションはある…と思う。思いたい。

2011/6/4 追記

上記の方法で「設置」はできるのですが、これは「正しい設置」ではないということがわかりました。
自分のサイトにコメントが投稿されたことを知るためにはComment Moderation Toolというものを使用するのですが上記だけだとこのModeration Toolに正しく通知が送られず、せっかく入れてもらったコメントに気が付かない…ということになっていまします。

「iPhone 研究室」さんのエントリー『Facebook ソーシャルプラグイン（いいね！やコメント）を「正しく」設置する方法』を参考にさせていただきました。

上記手順以外に次のことが必要になります。

      Open Graph Protocolタグの設置。
      Wordpressの場合はWP-OGPというプラグインで実装する。現在このプラグインにはタイプミスがあるので、wp-ogp.phpを開いて

      の”appid”を”app_id”に修正する。
      FacebookのJavaScriptSDKの設置。
      下記コードを使用しているテーマの”single.php”のとの間に入れる。コード内「アプリケーションID」は上記で作成したアプリケーションIDを記入する。

    大変失礼いたしました。_o_

    –

Read more from Tips