【みんビズ JimdoでFacebookのコメント欄を設置する方法】

久々にJimdoの技術メモを。Jimdoサイトに、Facebookのコメント欄を付ける方法です。探すといろいろ記事が出てきますが、Jimdo公式サイトに掲載されている情報が最も信頼できますね。

Add Facebook Comments to Your Site

引用させていただきます。下記のソースをコピーして、Jimdoの「ウィジェット/HTML」のボックスに貼り付けます。

<div>
<div id=”fb-root”>
<div style=”position: absolute; top: -10000px; height: 0px; width: 0px;”>
</div>
</div>
<script src=”http://connect.facebook.net/en_US/all.js#appId=APP_ID&amp;xfbml=1″ type=”text/javascript”>
</script><script type=”text/javascript” language=”javascript”>

//<![CDATA[
document.write(“<fb:comments href=’YOURSITE.jimdo.com’ num_posts=’10’ width=’500′><\/fb:comments>”);
//]]>
</script>
</div>

太字の箇所にご注目を。「href=’YOURSITE.jimdo.com’」は、「href=’Facebookのコメント欄を貼り付けたいJimdoのURL’」を入れてください。

表示するコメント数を変更する場合は、「num_posts=’10’」 (”内の数字を変更します。ここでは10個まで表示しています)

コメント欄の表示幅を変更する場合は「width=’500’」(”内の数字を変更します。単位はピクセルです。ここでは500ピクセルとしています)以上でできます。

実際に私のJimdoサイトで試しました

下の画像は、私のJimdoサイトの「はじめに」というページにFacebookコメント欄を設置しているところです。「ウィジェット/HTML」のボックスにコードを貼り付けます。

【「はじめに」ページにFacebookコメント欄を設置】

  • href (http://0225.jimdo.com/%E3%81%AF%E3%81%98%E3%82%81%E3%81%AB/)
  • num_posts (10)
  • width (750)

の3つの値はお忘れなくです。難しいと感じるのはこの3つの値の中の「href」でしょうかね・・・下記は、hrefの値を入れるときの注意点です。

注意1:hrefのURLについて

はじめに」ページのURLは「http://0225.jimdo.com/はじめに/」です。これを貼り付けると

「http://0225.jimdo.com/%E3%81%AF%E3%81%98%E3%82%81%E3%81%AB/」と、長い文字列に変換されました。(赤字の部分です)

これはこれで正常な動作なので気になさらないで下さい。おそらく初めての方はここで戸惑うと思います。続いてもう1つ注意点があります。

注意2:保存を押して終了、のはずが・・・

なんとか設置をしたとしましょう。で、保存を押すと、下の画面になって「更新する」がぐるぐる回って終わりません。

【「更新する」が終わらない】

これは、しょうがないみたいですね。また Add Facebook Comments to Your Site から引用させていただきます。

5. Sometimes the element seems to be loading and loading, but not to worry:Once you get this far, click on “view” or “logout” to see the results.

英語は苦手なのですが、上の要約は「時々こういうことがあるけど大丈夫。設置したページをログアウトして確認してくれればいいよ」ということのようです。まあ、実際大丈夫でした。

【無事設置できました】

正直、ここはちょっと焦りますけどね。

まとめ

  • JimdoにFacebookのコメント欄を入れる方法
  • JimdoにFacebookのコメント欄を入れたけど、コメント数とか表示幅を変更するにはどうしたらいいか

という情報をお探しの方に、ご参考いただければ幸いです。

著者:bouya Imamura