Как установить на блоге комментарии Facebook без плагина

  Автор:
  5580
Как установить комментарии в Facebook без плагина

Я заметила, что аудитория моего блога делиться на 2 категрии — те у кого блог создан на шаблоне AB-Inspiration и те, у кого блог на обычном шаблоне.

Чтобы никого не обижать я решила открыть рубрику «Фишки без плагинов«. Здесь я рассказываю о встроенном функционале шаблона AB-inspiration и о том как это можно реализовать на обычном шаблоне.

Для любознательных пользователей шаблона AB-Inspiration будет интересно, как этот функционал реализован в шаблоне, а для тех у кого блог на обычном шаблоне, смогут реализовать фишки самостоятельно. :)

Сегодня, продолжим тему как установить комментарии социальных сетей на блог (Коментарии facebook и Виджет комментариев Вконтакте), а также отслеживать комментарии Facebook и отслеживать комментарии Вконтакте.

Сегодня я покажу как настроить и установить комментарии в Фейсбук.

Так же как и комментарии Вконтакте, комментарии в Фейсбук помогут распространять Ваши статьи в социальной сети Фейсбук и привлекать больше посетителей на Ваш блог.

В шаблоне AB-Inspiration уже встроены комментарии Facebook и отображаются в конце каждой статьи. Чтобы комментарии в Фейсбук появились на блоге пользователям шаблона AB-Inspiration нужно:

1. вставить ID приложения Facebook в «Настройках шаблона» в разделе «Вставки»

Снимок экрана 2014-10-31 в 8.37.01

2. в разделе «Настройка статей» выбрать как будут отображаться комментарии — в виде вкладок или подряд.

Снимок экрана 2014-10-30 в 21.31.38

Для всех других шаблонов, необходимо установить код комментариев фейсбук.

Регистрация приложения Facebook

1. Зайдите в фейсбук под своим логином и паролем

2. Перейдите по ссылке http://developers.facebook.com/

3. Выберите в меню «Apps» — «Add New App»

commentsfb

4. Во всплывшем окне выберите значок «WWW» — вебсайт

facebookcomments

5. В поле впишите название приложения (можно просто название блога) и нажмите на кнопку «Create New Facebook App ID»

fbcomments1

6. Во всплывшем окне выберите категорию и нажмите на кнопку «Create App ID»

fbcomments3

7. Спуститесь ниже на странице, в поле Site URL пропишите адрес Вашего блога и нажмите «Далее»

fbcomments2

 

8. Далее на странице скопируйте номер ID Вашего приложения. Сохраните этот ID. Он нам пригодиться в следующем шаге.

fbcomments4

Все, регистрация приложения завершена.

Код комментариев Facebook

Код делиться на 2 части.

1-ю часть нужно вставить в файл header.php сразу после открывающего тега body.

2-ю часть нужно вставить там, где Вы хотите, чтобы отображались комментарии. Обычно в конце каждой статьи. За вывод отдельной статьи отвечает файл single.php.

В примерах я даю адаптированный код под WordPress. В первой части включена асинхронная загрузка. Во второй части ссылка в виде функции  WordPress get_the_permalink();. Эта функция динамически подставляет адрес статьи.

 

Вставка кода в header.php 


<div id="fb-root"></div>
<script>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.async=true;
js.src = "//connect.facebook.net/ru_RU/sdk.js#xfbml=1&appId=XXXXXXXXXXXXXXX&version=v2.0";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>

1. Скопируйте код
2. Зайдите в админку блога — Внешний вид — Редактор
3. Откройте файл header.php для редактирования
4. Вставьте код сразу после тега <body>
5. Вместо XXXXXXXXXXXXXXX, вставьте Ваш ID Приложения в Фейсбук, который Вы скопировали в предыдущем шаге

Вставка кода в single.php 


<div class="fb-comments" data-href="<?php get_the_permalink(); ?>" data-num-posts="20" data-width="585"></div>

1. Здесь Вы можете заменить:
data-num-posts=»20″ — количество комментариев на странице
data-width=»585″ — ширина блока комментариев

2. Скопируйте этот код
3. Зайдите в админку — Внешний вид — Редактор
4. Откройте файл single.php для редактирования
5. Вставьте код до или после функции comments_template();

Подробно о вставке кода в single.php я написала в предыдущей статье Как установить на блоге Комментарии Вконтакте без плагина

Все готово! Теперь можно посмотреть, что у нас получилось. Откройте блог, перейдите на страницу со статьей. В конце статьи должна появиться форма для отправки комментариев Фейсбук.

Снимок экрана 2014-10-31 в 9.28.54

Если у Вас возникли вопросы, не стесняйтесь, задавайте в комментариях.

Предыдущие статьи на тему «Фишки без плагинов»:

Как установить на блоге комментарии Facebook без плагина

   2 голоса
Средняя оценка: 5 из 5
Вы находите данную статью полезной или интересной? Поделитесь ею, пожалуйста, с другими - просто нажмите на кнопки ниже:
Самые Важные Оповещения Блога + Четкий Комплект Ценных Подарков ДЛЯ БЛОГЕРОВ И ФРИЛАНСЕРОВ
Комментарии на блоге
26 комментариев
  1. Здравствуйте! Читая статью думал, что вот она та самая супер статья со скриншотами. Но когда дело дошло до вставки плагина начались проблемы. Пункт 2, Зайдите в админку блога — Внешний вид — Редактор: У меня нет такого слова Редактор. Только Настроить есть.

    Пункт третий, Откройте файл header.php для редактирования. И как его открывать ? Без понятия вообще

  2. Не получилось ничего по вашей ссылке. Видимо платное уже стало…. Дизайн страницы Фейсбука совсем другой. Очень жаль…

Комментарии в Фейсбук
Комментарии в Вконтакте