Комментарии VK на сайт

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

Итак, как вставить комментарии vk на сайт.

Оглавление:

  1. Создаем новое приложение
  2. Установка формы комментариев ВК на сайт
  3. Заключение

Процесс можно условно разделить на 2 этапа — создание приложения и установка его на сайт.

Создаем новое приложение

Переходим в инструменты разработчика vk по ссылке:

https://vk.com/dev

Здесь переходим в раздел «Подключение сайтов и виджетов».

Инструменты разработчика

Здесь будут перечислены все варианты, с кратким описанием. Нас интересует пункт «Комментарии».

Раздел "Комментарии"

Щелкаем по ссылке, и попадаем в панель конструктора кода.

Здесь нам нужно выбрать следующие настройки.

  1. В пункте «Сайт/приложение», мы раскрываем выдающее меню, и выбираем «Подключить новый сайт». Заполняем все пункты:
    • Название сайта — напишите краткое название.
    • Адрес сайта — укажите полный урл (пример: http://site.ru)
    • Основной домен — тоже самое, только без протокола http (пример: site.ru)
    • Из списка выберите тематику сайта. Затем щелкаем кнопку «Сохранить»
  2. Укажите количество комментариев, которые будут выводиться на странице
  3. В блоке «Медиа», отметьте все варианты, которые вы хотите реализовать в форме
  4. Установите ширину формы. Значение нужно указывать в пикселях
  5. Ниже вы увидите сформированный код для вставки на сайт, и пример внешнего вида, который получится

Устанавливаем параметры

Не закрывайте эту страницу — нам нужен будет код.

Код формы комментариев vk

Установка формы комментариев ВК на сайт

Если вы обратите внимание на сформированный код, то увидите, что он разделен на 2 части. Первую из них нужно поставить в блок «head» вашего сайта. Второю часть — в основной материал страницы, в том месте, где должна размещаться форма комментариев (тег «body»).

Первый блок начинается с такой пометки:

<!-- Put this script tag to the <head> of your page -->
<script type="text/javascript" src="//vk.com/js/api/openapi.js?117"></script>
<script type="text/javascript">
  VK.init({apiId: API_ID, onlyWidgets: true});
</script>

Второй вот с этого момента:

<!-- Put this div tag to the place, where the Comments block will be -->
<div id="vk_comments"></div>
<script type="text/javascript">
VK.Widgets.Comments("vk_comments", {limit: 10, width: "665", attach: "*"});
</script>

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

<html>
<head>
Служебный раздел
<head>
<body>
Основной раздел
</body>
</html>

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

Так вот, первую часть кода формы мы должны вставить перед закрывающим тегом «/head». Вторую — в том месте, где хотим расположить форму. Но обязательно, между тегами «body — /body»

Для этого, вам необходимо отредактировать соответствующие страницы вашего сайта, и в каждую из них, где должны работать комментарии — вставить код по описанному принципу.

Заключение

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

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

1 Звезда2 Звезды3 Звезды4 Звезды5 Звезд (4 участников, средняя оценка: 4,25 из 5)
Загрузка...