Комментарии из Вконтакта

Комментарии из Вконтакта

Комментарии из вконтакте, для чего это нужно? Во-первых, это в разы увеличит количество комментариев. Во-вторых, нет необходимости вводить капчу и авторизоваться, достаточно лишь быть зарегистрированным вконтакте, т.к на сегодняшний день это одна из популярных соц. сетей все желающие смогут оставить свой комментарий без труда. В-третьих, комментарий будет опубликован на стене человека который прокомментировал пост, это тоже дополнительный плюс. В общем не ленитесь и разместите себе такой же блок, времени это у Вас много не займёт, зато пользователям будет намного удобнее комментировать Вас.

Внимание, сразу хочу отметить, что для размещения комментариев вконтакте на Ваш сайт необходимо быть администратором той самой группы!

И так, поехали

Получение и установка кода вставки комментариев вконтакте

Первое — Проходим по ссылке https://vk.com/apps?act=manage

Создать приложение вконтакте

Здесь нам предлагают создать приложение, подключить к нему сайт и заполнить несколько важных полей. Поэтому жмем кнопку создать.

Настройка приложения вконтакте

  1. Вводиим название приложения
  2. Radio Button, выбираем — сайт
  3. Вводим адрес сайта в формате http://site.ru/
  4. Вводим доменное имя в формате site.ru
  5. Жмем на кнопку — «Подключить сайт»

Лучше всего использовать в качестве названия доменное имя, на случай, если у Вас несколько сайтов, и чтобы не путаться

Далее, в верхнем меню выбираем «Мои приложение», и жмем на «Редактировать»

Редактировать приложение вконтакте

Теперь дело осталось за малым. В названии должно быть имя, которое мы вписывали при создании приложения ранее. Теперь выбираем из выпадающего списка, группу, с которой и будет работать виджет комментариев и жмем на «Сохранить изменения»

Привязка группы к приложению

Осталось получить код вставки, переходим по ссылке https://vk.com/dev/Comments

Получаем код для вставки на сайт

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

Сразу, оговорюсь, что я немножко его подправлю, чтобы валидатор не выбивал ошибки, и разделю его на две части.

Эту часть кода необходимо вставить между тегами

<head> и </head>

Первый скрипт подключает библиотеку openapi.js, второй ее инициализирует



Следующая часть кода вставляется уже непосредственно там, где необходимо отображать комментарии

Ну вот собственно и все, далее рассмотрим возможные модификации

Модификация вставки комментариев на сайте

Кстати, небольшая правка, позволит растягивать окно комментариев на ширину блока, в котором он находится, добавьте себе в style.css следующее

#vk_comments{
  width:100%!important;
  height:190px;
}

Если необходимо, чтобы блок комментариев разтягивался только в мобильной версии, то советую сделать примерно так:

@media screen and (max-width:992px){
  #vk_comments{
  width:100%!important;
  height:190px;
  }
}

А вот как выгладит вставка с комментариями вконтакте на одном из моих сайтов

Так выглядит вставка комментариев на одном из моих сайтов

Опубликовано: 00:29-04.04.2016

1 Комментарий —  Развернуть


Ответить на комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *