おすすめ記事ピックアップ
BloggerにFaceBookの簡易コメント欄を設置しても、トップページのURLしか認識されず、各ページを認識したコメント欄の設置ができず、悩んでいる人も多いのではないでしょうか。
こちらからFaceBookの簡易コメント欄がコードを取得できます。
https://developers.facebook.com/docs/plugins/comments
こちらからFaceBookの簡易コメント欄がコードを取得できます。
https://developers.facebook.com/docs/plugins/comments
上記にURLを入れて、コードを書き出せば、FaceBookのコメント欄を設置できます。しかし対象となるURL部分をページごとに変わるように、書き換えする必要があります。それをしないと、どのページでコメントしても、トップページへのコメントになってしまいます。
ちなみに簡易コメントだと、コメントがあってもFaceBookと紐付けされていないため（当然）、コメントがあったことは通知されません。あくまでもそのページに、FaceBook利用者はコメントを書くことができるだけとなります。返信しないコメント欄となります。もちろん気がつけば返信できます。
コメント通知が必要な人は、FaceBookにログインして、専用のコメント作成ツールを使ってコメント欄をつくった方が良いでしょう。まあでもFaceBookを使っていない人も多いでしょうし、コメント管理は面倒くさいので、適当にFaceBookのコメント欄をおいておけばいいや、という人向けに説明します。
コメント通知が必要な人は、FaceBookにログインして、専用のコメント作成ツールを使ってコメント欄をつくった方が良いでしょう。まあでもFaceBookを使っていない人も多いでしょうし、コメント管理は面倒くさいので、適当にFaceBookのコメント欄をおいておけばいいや、という人向けに説明します。
コード書き出しページで、URLを入れてコードを書き出します。
こんなコードが出てきます。上の欄のコードはページのどこかに書き込んで、コメント欄を表示肢体場所に、下のコードを書きます。
このコードですがdata-hrefに書き込まれたURLでしかコメントが機能しません。
<div class="fb-comments" data-href="http://www.furimuke.com/" data-numposts="5" data-colorscheme="light"></div>
これを各ページに貼り付けても、1つのURLとしてしかコメントされません。そこでこのように書き換えます。
<div class="fb-comments" expr:data-href="data:post.canonicalUrl" data-numposts="5" data-colorscheme="light"></div>
Bloggerの独自のコードで、ページごとのURLを取得するコードなんです。canonicalを加える事で、スマートフォン等からのコメントも同じものとして認識してくれます。
あとはBif（各投稿ページでしか表示しない）で囲んでおけばOKです。
あとはBif（各投稿ページでしか表示しない）で囲んでおけばOKです。
<b:if cond='data:blog.pageType == "item"'> <div class='fb-comments' expr:data-href='data:post.canonicalUrl' data-numposts='5' data-colorscheme='light'></div> </b:if>
