Комментарии социальных сетей «Вконтакте» и «Facebook» на сайт

Здравствуйте дорогие друзья! Сразу хочу поздравить Вас с Наступившим Новым годом, пожелать Вам счастья, успеха в Ваших начинаниях, финансового благополучия, а самое главное – здоровья Вам и Вашим близким! Надеюсь, 2013 год оправдает Ваши ожидания, и Вы выполните все то, что наметили. Я в свою очередь постараюсь не разочаровать Вас и буду писать классные статьи и делать качественные видео-курсы. К слову, в одной из своих статей я писал, что к 31 декабря сделаю видео-курс по созданию инфопродукта.

К сожалению, в указанные сроки я не уложился, но курс находится на стадии завершения. В него войдет урок по camtasia studio, подробный урок по созданию презентаций, комплект из 10 3D обложек и подробный урок по их созданию, остальное пока секрет. Курс будет бесплатным. Подписывайтесь на обновления, чтобы не пропустить релиз. Сегодня я пишу первую статью в этом году, и она расскажет Вам, как поставить комментарии социальных сетей к себе на блог/сайт, для чего это нужно я писал в статье про продвижение в социальных сетях.

Комментарии от социальных сетей на WordPress

Мы будем ставить форму комментариев от “Вконтакте” и “Facebook”, начнем с отечественного контакта. Переходим по этой ссылке и попадем на страницу добавления виджета комментариев:

Графа название сайта предназначена для удобства админа, сюда пишем удобное название площадки. Далее прописываем адрес сайта и его основной домен, например,  life-webmaster.ru. Для добавления виджета жмем “сохранить”.

Затем выбираем количество комментариев, которые будут видны на странице, их может быть 5, 10, 15 и 20. Я обычно оставляю стандартное значение “10”. Галочку “включить расширенные комментарии” – оставляем. Она позволяет добавлять к комментариям картинки, видео, музыку и другие медиа-файлы. Чуть ниже можно настроить ширину формы, это значение выводится в пикселях.

После всех настроек переходим к коду формы:

Первую половину кода вставляем в файл header.php перед тегом </head>, вторую – туда, где хотим видеть форму, у меня он расположен в файле single.php. Вот и все, форма комментариев добавлена и можно ею пользоваться. Проверку комментариев можно осуществлять через кнопку “администрирование”, там же можно удалять и добавлять в черный список особо наглых пользователей.

Комментарии от Facebook

Над ними мне пришлось изрядно попыхтеть. Дело в том, что если вставить форму напрямую со страницы плагина комментариев, то возможности их модерирования не будет, а комментарий, оставленный к конкретной записи, будет виден на всем сайте. Это естественно меня не устраивало и пришлось искать пути решения этой проблемы. Здесь уже будет описано готовое решение по комментариям facebook.

Для начала перейдите по этой ссылке, и пролистайте страницу до раздела “Moderation Tools” – он отвечает за настройки модерации. В этом разделе Вы увидите два кода, которые мы должны вставить между тегами <head></head>:

<meta property="fb:admins" content="{YOUR_FACEBOOK_USER_ID}"/>
<meta property="fb:app_id" content="{YOUR_APPLICATION_ID}"/>

В этих кодах есть две переменных: {YOUR_FACEBOOK_USER_ID} и {YOUR_APPLICATION_ID}, вместо первой нужно прописать ID нашего профиля, вместо второй – ID приложения.

Для начала добудем id профиля. Стандартный id выглядит таким образом:

http://www.facebook.com/profile.php?id=100004045165908

Чтобы его получить перейдите на страницу профиля и посмотрите его ссылку, нужные цифры находятся после “id=”.

Теперь если у Вас пользовательский id. Выглядит он таким образом:

http://www.facebook.com/kirill.unak

kirill.unak – то что нам нужно. Копируем этот хвостик и вставляем его в конец этой ссылки:

https://graph.facebook.com/ kirill.unak

В итоге Вы попадете на страницу, где будет указан цифровой идентификатор:

Полученные цифры вставляем в первый код, у меня он выглядит вот так:

<meta property="fb:admins" content="100004045165908"/>

Далее нужно получить id приложения. Чтобы это сделать, переходим по ссылке и заполняем форму ниже:

В графу “App Name” пишем название приложения, например, comments. Жмем продолжить.

Вводим символы с капчи, а также номер телефона (если попросят), это нужно для подтверждения своего аккаунта на facebook.

После этих действий, Вы попадете на страницу настроек приложения:

Здесь нам нужна графа “App domains”, в которую мы пишем имя домена сайта без http и слеша, например, life-webmaster.ru, а также Website with facebook login, где в поле Site URL пишем полный адрес сайта со слешем и http. После всего этого жмем “сохранить изменения” и в верхней строчке копируем цифры из “App id”.

Вставляем эти цифры в наш код, вот какой он получился у меня:

<meta property="fb:app_id" content="186419788169712"/>

После изменений этих кодов, помещаем их в файл header.php между <head></head>. Теперь приступаем к вставке самой формы.

Переходим на страницу плагина комментариев и заполняем форму ниже:

  • В первое поле пишем адрес сайта
  • Графа Width отвечает за ширину формы. У меня она 600
  • Number of posts отвечает за количество комментариев на странице. У меня – 5. Если комментариев больше, страницу можно листать в низ
  • Color Scheme отвечает за дизайн формы. Он может быть либо светлый (light), либо темный (dark)

После настроек нажимаем “Get code” и видим всплывающее окно, где прописаны необходимые нам коды:

Код из первого поля вставляем в файл header.php после тега <body> (так рекомендовано самим facebook), код из второго поля вставляем в нужное место шаблона.

Чтобы комментарий отображался только на конкретной записи, адрес сайта в коде вывода формы, нужно заменить на:

<?php the_permalink(); ?>

В итоге код для вставки формы получился вот таким:

<div data-href=" <?php the_permalink(); ?> " data-width="470" data-num-posts="2"></div>

Чистить комментарии можно на странице управления приложением, попасть туда можно по этой ссылке.

Как вставить комментарии от социальных сетей на DLE

Делаем почти все то же самое только первые два кода вставляем в файлик main.tpl Вашего шаблона, а код формы вставляем в самый конец fullstory.tpl.

Вот в принципе и все. Подписываемся на обновления блога, чтобы не пропускать статей, а также жмякаем на кнопки соц. сетей.

Ваш комментарий

  1. С Вконтакте как — то проще. :)
    Что-то у тебя комментариев маловато! Комментируй чужие блоги почаще, и тогда и тебя начнут!

    УдачИ!

  2. uriy:

    Спасибо за статью. Очень интересно, пойду ставить форму.

  3. А у меня с комментариями от контакта при установке проблемка возникла — 2 формы появляется и одну никак не могу убрать.

  4. Мне что-то эта затея не понравилось. Предположим будет много комментариев. Тогда все кто с контакта будут наверху, с фейсбука ниже, а блогеры вообще в самом низу.

    • Кирилл Тараненко:

      Во-первых, когда много комментариев, форма сворачивается и остается 5 комментариев, дальше идет кнопка «развернуть». Во-вторых, лично мое мнение, стандартные комментарии на сайтах слишком не удобны -ввод имени и мыла отбивает охоту комментирования, поэтому нужно предоставлять людям альтернативные варианты

  5. Как раз эти две формы комментариев очень полезны. Не всегда пользуюсь, но не могу не признать их эффективность. Спасибо за столь подробное описание способа установки форм. То, что нужно. В ближайшие дни обязательно займусь. Сегодня никак, Андрею на сайте нужно план по комментариям выполнять))

    • Кирилл Тараненко:

      Да я видел, Вы там неплохо разогнались:) Кстати и здесь лидерство заняли и по комментариям и по номинации:)

  6. Вот сейчас посмотрел на форму комментариев и обратил внимание на такую вещь. Как раз формы социальных сетей имеют значительно меньше комментариев. Почему, неясно. Может быть люди не хотят светить свои комментарии в сетях. А в стандартной форме автозаполнение работает после первого коммента, это удобно. Вопрос, что лучше. считаю сейчас очень спорным. Если только как дополнение.

    • Кирилл Тараненко:

      Ну смотря еще какой контент. Лично у меня на двух статьях через форму Вконтакте очень активно комментируют. А сайты развлекательной тематики вообще половину комментариев получает с этой формы. На блоге использую как дополнение, есть же оно не просит и бложик не грузит.

  7. Ну вот хорошо, когда есть возможность узнать из первых рук об опыте применения таких форм подписки. Как раз и вопросы я задаю по этой теме. чтобы получить достоверную и объективную информацию. Если не грузит, так и не помешает.

  8. Den:

    что то не работает то новости новороcсии хотел поставить на сайт nvrus.org

  9. автосервисы сочи,автоэлектрик в Сочи http://avtomaster-sochi.ru/

  10. уроки фотошопа для начинающих http://photoshop-gid.ru/

  11. уроки фотошоп онлайн бесплатно http://photoshop-gid.ru/

  12. ремонт квартир в москва,ремонт домов москва,снять квартиру в москва,снять дом в москва,купить квартиру в москва,купить дом в москва,ремонт автомобилей москва,ремонт холодильников в москва,ремонт стиральных в москва,ремонт стиральных машин в москва http://administration-moscow.ru/

  13. интернет магазин одежды,интернет магазин детской одежды,женский интернет магазин,интернет магазин москва,интернет магазин женской одежды,интернет магазин детской одежды,недорогой женский интернет магазин,интернет магазин дешевой одежды

  14. кафе в пушкине,караоке в пушкине,боулинг в пушкине,дискотеки в пушкине http://kompas-star.ru/