Я заметила, что аудитория моего блога делиться на 2 категории — те у кого блог создан на шаблоне — конструкторе AB-Inspiration и те, у кого блог на обычном шаблоне.
Чтобы никого не обижать я решила открыть рубрику «Фишки без плагинов«. Здесь я рассказываю о встроенном функционале шаблона AB-inspiration и о том как это можно реализовать на обычном шаблоне.
Для любознательных пользователей шаблона AB-Inspiration будет интересно, как этот функционал реализован в шаблоне, а для тех у кого блог на обычном шаблоне, смогут реализовать фишки самостоятельно. 
Сегодня, продолжим тему как установить комментарии социальных сетей на блог (Коментарии facebook и Виджет комментариев Вконтакте), а также отслеживать комментарии Facebook и отслеживать комментарии Вконтакте.
Сегодня я покажу как настроить и установить комментарии в Фейсбук.
Так же как и комментарии Вконтакте, комментарии в Фейсбук помогут распространять Ваши статьи в социальной сети Фейсбук и привлекать больше посетителей на Ваш блог.
В шаблоне AB-Inspiration уже встроены комментарии Facebook и отображаются в конце каждой статьи. Чтобы комментарии в Фейсбук появились на блоге пользователям шаблона AB-Inspiration нужно:
1. вставить ID приложения Facebook в «Настройках шаблона» в разделе «Вставки»
2. в разделе «Настройка статей» выбрать как будут отображаться комментарии — в виде вкладок или подряд.
Для всех других шаблонов, необходимо установить код комментариев фейсбук.
Регистрация приложения Facebook
1. Зайдите в фейсбук под своим логином и паролем
2. Перейдите по ссылке http://developers.facebook.com/
3. Выберите в меню «Apps» — «Add New App»
4. Во всплывшем окне выберите значок «WWW» — вебсайт
5. В поле впишите название приложения (можно просто название блога) и нажмите на кнопку «Create New Facebook App ID»
6. Во всплывшем окне выберите категорию и нажмите на кнопку «Create App ID»
7. Спуститесь ниже на странице, в поле Site URL пропишите адрес Вашего блога и нажмите «Далее»
8. Далее на странице скопируйте номер ID Вашего приложения. Сохраните этот ID. Он нам пригодиться в следующем шаге.
Все, регистрация приложения завершена.
Код комментариев Facebook
Код делиться на 2 части.
1-ю часть нужно вставить в файл header.php сразу после открывающего тега body.
2-ю часть нужно вставить там, где Вы хотите, чтобы отображались комментарии. Обычно в конце каждой статьи. За вывод отдельной статьи отвечает файл single.php.
В примерах я даю адаптированный код под WordPress. В первой части включена асинхронная загрузка. Во второй части ссылка в виде функции WordPress get_the_permalink();. Эта функция динамически подставляет адрес статьи.
Вставка кода в header.php
<div id="fb-root"></div> <img src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7" data-wp-preserve="%3Cscript%3E(function(d%2C%20s%2C%20id)%20%7B%0Avar%20js%2C%20fjs%20%3D%20d.getElementsByTagName(s)%5B0%5D%3B%0Aif%20(d.getElementById(id))%20return%3B%0Ajs%20%3D%20d.createElement(s)%3B%20js.id%20%3D%20id%3B%0Ajs.async%3Dtrue%3B%0Ajs.src%20%3D%20%22%2F%2Fconnect.facebook.net%2Fru_RU%2Fsdk.js%23xfbml%3D1%26appId%3DXXXXXXXXXXXXXXX%26version%3Dv2.0%22%3B%0Afjs.parentNode.insertBefore(js%2C%20fjs)%3B%0A%7D(document%2C%20'script'%2C%20'facebook-jssdk'))%3B%3C%2Fscript%3E" data-mce-resize="false" data-mce-placeholder="1" class="mce-object" width="20" height="20" alt="<script>" title="<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 я написала в предыдущей статье Как установить на блоге Комментарии Вконтакте без плагина
Все готово! Теперь можно посмотреть, что у нас получилось. Откройте блог, перейдите на страницу со статьей. В конце статьи должна появиться форма для отправки комментариев Фейсбук.
Если у Вас возникли вопросы, не стесняйтесь, задавайте в комментариях.
Предыдущие статьи на тему «Фишки без плагинов»:
- Как установить на блоге Комментарии Вконтакте без плагина
- Как опубликовать запись с блога в Facebook с картинкой на всю ширину
- Как сделать так, чтобы в Твиттер вместе с твитом уходил полноценный анонс статьи
Создать сайт для заработка с нами — легко и быстро!
За помощью обращайтесь в нашу службу поддержки 24/7
Нужен качественный хостинг для сайта на WordPress?
Рекомендую, проверенные годами, хостинг Timeweb:
а также, хостинг Beget:
Средняя оценка: 3.7 из 5
Анфиса, спасибо за полезную статью. Как всегда все процессы указаны поэтапно и понятно, это очень важно для тех, кто только начинает создавать свой блог.
Анфиса , здравствуйте. У меня ничего не получилось(. В файле single.php у меня вообще нет функции comments_template() . И когда копирую первую часть кода никаких XXXXXXXXXXXXXXX тоже нет, сразу копируется с ID . Сайт на Вордпрессе. Что делать?
Ирина,
1. в Вашем шаблоне шаблон страницы single вынесен в отдельный файл: loop-single.php. В этом файле есть функци comments_template()
2. если Вы копируете код в фейсуке, то ID уже должен стоять, если Вы предварительно зарегистрировали приложение. Про XXXXXXX — я говорю если вы копируете первую часть кода у меня на блоге в статье. В статье я даю код немного измененный. В нем добавлена строка отвечающая за асинхронную загрузку скрипта. Но если Вам удобнее, Вы можете скопировать в фейсбук и тогда менять XXXXXXX на свой ID не нужно.
Спасибо , Анфиса . Буду пробовать еще ). Успехов Вам !
Попробовала . Опять ничего не вышло. У меня в файле header.php нет тега . Есть только <body . Вставила после него и вышло непонятно что . А comments_template() нашла , как Вы сказали . Так что форму все еще не удается поставить .(
Первую часть кода нужно вставить после тега>.
В Вашем случае после:
Анфиса, попробовал создать приложение на Facebook, но оказывается у меня номер телефона не подтвержден! СМС-ка до сих пор не пришла…
Азик, попробуйте другой телефон. Помоему была как то проблема с билайном. Я точно сейчас не помню. Просто попробуйте отправить смс на телефон другого оператора.
Анфиса, как всегда слежу за Вашей рассылкой и очень актуальна тема с ФБ, хотя ID прописано, когда изначально велись настройки блога, но заметила, что фото нет в комментариях через ФБ, в ВК есть, потом мне написали пользователи, кто хотел оставить комментарии к статьям, что не могут написать, пропали обычные поля для адреса почты, имени и тд, я посмотрела и действительно, что-то не так. Заранее благодарю за техническую поддержку по-этим вопросам.
Зарема, скорее всего Вы отклюили возможность комментировать. Зайдите в админку в раздел «Записи» — найдите ту статью в которой нет полей для комментариев, и откройте ее для редактирования.
Спуститесь ниже — найдите блок «Обсуждение» и поставьте галочку напротив «Разрешить комментарии»
Если Вы этого блока не видите, то поднимитесь наверх и нажмите на кнопку справа «Настройки экрана». Найдите в открывшемся блоке пункт «Обсуждение» и отметьте его галочкой.
После этого спуститесь ниже и Вы увидите блок блок «Обсуждение». поставьте галочку напротив «Разрешить комментарии»
Анфиса, очень рада Вас приветствовать! Все работает, Благодарю Вас и Василия за самую чЁткую и молниеносную Техподдержку! Вы всегда на связи и всегда окрыты своему подписчику!
Вы самые Лучшие!!! Браво!!! 
Анфиса, твои завлекательные клубнички продолжаются, чтобы привлечь больше посетителей на наши блоги. Шикарно!
Анфиса, большое спасибо Вам за полезную информацию! Все сделала, как Вы учите, все отображается на странице, но ниже появилась такая запись —
«Обратите внимание, данный плагин комментариев работает в режиме совместимости, но не содержит еще ни одной публикации. Попробуйте указать значение атрибута «href», как предложено в документации к плагину комментариев, чтобы задействовать все функции плагина». Как мне убрать эту запись, подскажите пожалуйста.
Альбина, Вы копировали код с фейсбук или со статьи? В статье «Вставка кода в single.php» я даю код, уже адаптированный под WordPress с href. Скопируйте его еще раз и замените тот, что Вы вставили в файле single.php
Спасибо за статью. Есть проблема.
После пункта 6 у меня появляется сообщение
Not Authorized To Manage Apps
This account is not authorized to manage apps. Please use your verified personal Facebook account to create and manage your apps.
Что делать?
Алексей,
В предупреждении написано:
«Не авторизованы для управления приложениями. Этот аккунт не авторизован для управления приложениями. Пожалуйста, используйте Ваш персональный верифицированный аккаунт (подтверждена подлинность аккаунта) для создания и управления приложениями.»
Это значит, что при создании аккаунта в Фейсбук Вы не подтврдили подлинность своего аккаунта. Это обязательное условие фейсбук для предотвращения спама и всевозможного злоупотребления.
Есть 2 способа подтвердить подлинность:
1. Подтвердить мобильный телефон — это можно сделать по этому адресу: http://www.facebook.com/confirmphone.php
2. Ввесит данные кредитной карты — https://secure.facebook.com/cards.php
После подтверждения подлинности аккаунта можете создать приложение.
Спасибо за помощь. Телефон подтвердил.
Ваш мобильный телефон был успешно подтвержден.
Но проблема осталась.
Попробуйте второй способ. Или свяжитесь с тех поддержкой фейсбук.
Здравствуйте! Помогите, пожалуйста мне тоже) У меня тоже в файле single.php отсутствует comments_template. Не подскажете, где мне его найти? Спасибо!
Татьяна, Ваша тема создана в программе Artisteer. ПРограмма использует классический набор файлов. Так что comments_template должен быть в файле single.php. Если все же не можете найти можно попробовать 3 варианта:
1. обратиться с вопросом на форум разработчиков программы: http://www.artisteer.com/?p=forums
2. скачать папку с шаблоном на компьютер и через поиск найти файл в котором содержится функция comments_template.
3. перейти на шаблон AB-Inspiration. В нем уже все встроено, что необходимо для блога. https://ab-inspiration.com.
23 декабря будет 3 года со дня создания шаблона AB-Inspiration и будет большая скидка на сам шаблон и на дополнительные плагины WPForm — живая форма и слайдер — создание блока с формой подписки под шапкой или слайдер, «Входная страница» — создание главной презетационной страницы блога.
Спасибо большое за подробный ответ!
Я что-то формы комментирования от фейсбука у вас не встречал, Таня.
Анфиса, доброго времени суток
Каждую свободную минутку уделяю работе с блогом и на блоге
Недавно меняла все миниатюры, после просмотра Вашей записи с ТЦ «ВДОХНОВЕНИЕ»!
Заметила, что комменты с ФБ и с ВК опять пропали. Знаю про Вашу статью на эту тему, и вновь взялась за уточнение настроек.
Удивительно, ранее я регистрировалась в приложении ФБ, зашла и сразу увидела свой ID.
В админке блога после активной смены миниатюр ID пропало.
Я вставила Id и все показалось как надо, более я ничего не делала, поскольку в Вашем шаблоне AB-Inspirashion все уже встроено.
Кто проникнут Вашей деятельностью, знает Вашу ответственность, системность в подаче материала, всегда высоко оценит Ваш Громадный Труд!
Низкий Вам Поклон, Анфиса и Василий!
Здравствуйте! Читая статью думал, что вот она та самая супер статья со скриншотами. Но когда дело дошло до вставки плагина начались проблемы. Пункт 2, Зайдите в админку блога — Внешний вид — Редактор: У меня нет такого слова Редактор. Только Настроить есть.
Пункт третий, Откройте файл header.php для редактирования. И как его открывать ? Без понятия вообще
Tural, у вас блог на блого хостинге wordpress.COM. Данная инструкция для автономных блогов wordpress.ORG
Не получилось ничего по вашей ссылке. Видимо платное уже стало…. Дизайн страницы Фейсбука совсем другой. Очень жаль…
Спасибо за полезную статью !!! Успехов Вам )
Добрый день, хочу спросить а как можно сделать решение с Facebook, чтобы все комментарии на сайте под каждой статье где есть отдельно,
были видны на первой странице ?
Примерно так, как сделано с VK на этой странице? : cheatgo.ru
Можно вставить код комментариев в шаблон index.php. Или создать свой шаблон главной страницы и уже в него вставить код комментариев.
Добрый вечер. Вроде бы и зарегал приложение, и прописал все коды по 10 раз уже, а всё равно нет модерации. Сайт не на вордпрессе, если что. Что ж делать-то, почему так запутано всё