WordPressのブログにFacebookのコメント欄(Comment Box)を設置する方法・手順。

0
5
3
2

 

facebook comment.jpg

こまごまとしたところをいじるのが好き。PITE.(@infoNumber333)です。

今回はブログのコメント欄をFacebook対応のコメント欄にする方法を紹介します。別にネガティブなコメントが来るわけじゃないんですが、最近スパムが多くて…(´・ω・`)

「お!コメントキタ━━━━(゚∀゚)━━━━ッ!!」ってテンションで見てスパムだったりすると凹むので今のところその心配のないFacebookのコメント機能を使ってみることにしました。

これを機にFacebook上での交流も生まれたら面白いななんてことも思ってたり思ってなかったりします。

それではFacebookのコメント欄をWordPressに設置する方法を詳しく説明していきましょう。

Facebookのデベロッパー(開発者)登録

まず最初にFacebookのコメント欄のようなFacebookアプリと呼ばれるものを作成、使用するにはFacebookの開発者登録を済ませる必要があります。

下記のサイトで詳しく説明されているので参考にしながら登録しましょう。
開発者登録の手順 – Facebook開発者の為のサポートサイト | fb.developers’+

新しいFacebookアプリを作成

開発者登録が無事に済んだら次は新しいFacebookアプリを作りましょう。下記のページヘアクセス。
Facebook Developers

Number333_2013-09-01_8.23.20-1.jpg

画面右上の「新しいアプリを作成」をクリックしましょう。

th_Number333 2013-09-01 8.22.34-1.jpg

アプリの設定を聞かれるので好きなアプリ名を入力。
他の項目は適当で大丈夫です。
なぜか「Facebook」という単語を入れるとアプリ名が取得できませんでした。

Commnts Boxを設定

アプリの作成が完了したら、下記のリンクからコメントボックスを設定します。

Comments Box – Facebook開発者

Number333_2013-09-01_8.26.19-1.jpg

このようにwidth(横幅のサイズ)や表示する投稿の数、テーマカラーなどが選択できるので自分のブログに合わせて設定してください。

下のプレビューを見ながら気に入ったComment Boxができたら「Get Code」をクリック。

ブログにComment Boxを設置

th_Number333 2013-09-01 8.28.19-1.jpg

そうするとコードが生成されるのでHTML5の場合は上段のコードを<body>タグの直後に設置してください。

下段のコードはそのままではURLが固定されているので一つのページヘのコメントしかできなくなってしまうので、以下のコードをComment Boxを表示したい場所に設置してください。

[html]

正常にFacebookアプリが動いていればこのようにComment Boxが表示されているはず。

これで実装、完・了!!

Pite(@infoNumber333)はこう思うよ。

さて、折角コメント欄を設置したというわけなので、どしどしコメントお待ちしておりまーす( ・ㅂ・)!(正座待機

pitecomeimg.png

CATEGORY - OTHERS

total

10

share!

シェアしてくれるとめっちゃよろこびます。