Добавление Facebook комментариев к Octopress

В этой небольшой статья я опишу как добавить комментарии facebook к блогу на octopress. В octopress есть поддержка комментариев с использованием disqus, но мне ближе facebook.

Для начала необходимо зарегистрировать приложение на facebook для своего блога. Когда регистрация пройдена facebook должен выдать app id. Теперь можно приступить к настройке. Добавим facebook app id и параметры отображения комментариев в файл конфигурации _config.yml

_config.yml

# Facebook comments
facebook:
  appid: 222612811167194
  num_post: 5
  width: 789
  colorscheme: light

Следующим шагом добавим facebook javascript API на нашу страницу. Для этого можно воспользоваться уже имеющимся в octopress функционалом facebook like. И так, открываем siurce/_includes/facebook_like.html и меняем строчку содержащую js.src= заменив в ней цифры на app id полученный от facebook.

js.src = "//connect.facebook.net/en_US/all.js#appId=222612811167194&xfbml=1";

Теперь переходим к добавлению комментариев на страницы блога. Создаём файл source/_includes/post/facebook_comments.html и добавляем в него следующее:

facebook_comments.html

<noscript>Please enable JavaScript to view the comments powered by facebook</a></noscript>
<div
  class="fb-comments"
  data-href="{{ site.url }}{{ page.url }}"
  data-num-posts="{{ site.facebook.num_post }}"
  data-width="{{ site.facebook.width }}"
  data-colorscheme="{{ site.facebook.colorscheme }}" ></div>

Этот шаблон теперь можно вставлять в любое место блога, где вам хочется добавить комментарии. Осталось добавить их в посты и страницы блога. Страницы и посты строятся на основе post.html и page.html файлов из директории source/.layouts. ДОбавляем в них следующий код до или после блока кода, отвечающего за комментарии disqus:

{% if site.facebook.appid and page.comments == true %} 
  <section>
    <h1>Comments</h1>
    <div id="facebook_comments" aria-live="polite">
      {% include post/facebook_comments.html %}
    </div>
  </section>
{% endif %}

В целом это всё, что необходимо для добавления комментариев. Однако есть ещ> одна полезная вещь - добавление модерации. Для этого можно добавить следующую строку в файл source/includes/custom/head.html:

{% if site.facebook.appid %}
<meta property="fb:app_id" content="{{ site.facebook.appid }}" />
{% endif %}

Это должно разрешить модерацию всем админ пользователям вашего преложения в facebook.

Cyberflow

Добавление Facebook комментариев к Octopress

Related Posts