Как настроить виджет комментариев вконтакте

При помощи виджета ВКонтакте Вы можете за 5 минут добавить на Ваш сайт возможность комментирования статей и других материалов. Пользователи смогут комментировать Ваши материалы без дополнительной регистрации.

При желании, каждый оставленный комментарий может транслироваться на страницу комментатора ВКонтакте со ссылкой на исходную статью. Со страницы автора и из раздела Новости о статье узнают друзья автора и смогут присоединиться к дискуссии.

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

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

2. Вирусность. Каждый комментарий, оставленный через виджет, может автоматически транслироваться на страницу прокомментировавшего, а также попадает в Новости для его друзей. Такой комментарий всегда содержит ссылку на исходную статью. В результате о комментарии и существовании статьи узнают друзья комментатора, которые смогут присоединиться к дискуссии. Об их комментариях в свою очередь будут оповещены уже их друзья – и так далее. Дальше информация может распространяться лавинообразно.

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

4. Скорость. В отличие от других возможностей социализации, виджет ВКонтакте очень прост в установке и может быть внедрен на все страницы Вашего сайта в течение 5 минут. Для достижения высокой скорости установки и работы виджета мы применили новейшие технологии и задействовали десятки наиболее мощных серверов ВКонтакте.

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

6. Цитируемость. Каждый комментарий может становиться статусом пользователя ВКонтакте и содержит ссылку на Ваш ресурс. Комментарий появляется не только в новостях у друзей пользователя, но и в поиске по статусам ВКонтакте. Благодаря партнерству между ВКонтакте и Яндексом данные статусы в течение месяца будут индексироваться в поиске Яндекса в режиме реального времени, что станет источником дополнительной посещаемости для сайтов, разместивших виджет.

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

Источник

Как настроить виджет комментариев вконтакте

Чтобы добавить виджет комментариев ВКонтакте на свой сайт, выполните эти три шага:

I. В тег на странице Вашего сайта добавьте подключение openapi.js:

Более подробно про инициализацию транспорта Вы можете узнать на этой странице.

III. В тело страницы добавьте элемент DIV, в котором будут отображаться комментарии, задайте ему уникальный id, и добавьте в него код инициализации виджета. Например:

Приведенный код добавляет блок комментариев стандартного вида: изначально отображаются 10 последних комментариев. Ширина блока будет подобрана автоматически исходя из положения элемента с . Идентификатор странице будет задан по её URL.

Если на Вашем сайте уже используется Open API, добавить виджет ещё проще. Достаточно просто добавить инициализацию виджета (пункт III).

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

Панель состоит из трех вкладок:

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

Комментарии. На этой вкладке отображаются комментарии второго уровня.

Черный список. На этой вкладке отображаются пользователи, добавленные в черный список. Пользователи, находящиеся в этом списке, не имеют возможности комментировать материалы на Вашем сайте через виджет ВКонтакте.

Метод VK.Widgets.CommentsBrowse позволяет отображать комментарии со всех страниц Вашего сайта единым потоком. У каждого комментария есть ссылка на страницу сайта, где он был опубликован.

Он принимает два параметра:

element_id (string), обязательный параметр — id элемента, который будет являться контейнером для блока с обзором комментариев.
options (object) — опции блока с виджетом. Объект, который может содержат поля:
- width (integer) — ширина блока в пикселах. Минимальное значение: 300.
- height (integer) — максимальная высота блока в пикселах. Минимальное значение: 500. Если height = 0, то высота не ограничена. Если высота содержимого виджета больше максимально допустимой, появляется внутренняя прокрутка. Значение по умолчанию: 0.
- limit (integer) — максимальное число комментариев на странице. Минимальное значение: 5, максимальное значение: 100.
- mini (string) — минималистичный вид блока (уменьшенный шрифт, уменьшенные миниатюры прикреплений, уменьшенные профильные изображения для комментариев второго уровня). Возможные значения: 0 — отключен, 1 — включен, «auto» — выбирать автоматически в зависимости от доступной ширины. По умолчанию: «auto».
- norealtime (integer, [0,1]) — обновление ленты комментариев в режиме реального времени. 0 — включено, 1 — отключено. По умолчанию: 0.

Источник

Установка виджета комментариев ВКонтакте на сайт

Телеграм-канал Программист и бизнес.
Каждый день интересные истории, как программист строит бизнес.

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

Зачем нужен виджет Отзывы ВК

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

Так вот, есть возможность установить под каждой статьёй на вашем сайте или блоге не просто форму для ввода комментов, а виджет от Вконтакте. После этого оставляемые людьми комментарии будут появляться ещё и на их личных страницах в соцсети. И в них будет ссылка на ваш сайт! То есть вы получаете увеличенную ссылочную массу, да ещё к вам будут приходить френды ваших читателей. Сплошные преимущества!

Читайте также: Sos racemenu не работает

Достоинства

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

Конечно, для этого посетители должны быть зарегистрированы в этой соцсети, но в России она самая популярная, и свои аккаунты там имеют уже почти все.

Кроме этого, у софта есть и некоторые другие преимущества, о которых можно узнать прямо на странице его настройки.

Установка виджета комментариев ВКонтакте на сайт

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

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

Итак, что требуется для выполнения задачи?

Нужно зайти на ресурс ВК для разработчиков, вот здесь: https://vk.com/dev.

Кликните кнопку «Показать все», перед вами откроется такая страница:

Здесь вам будет нужна ссылка «Комментарии», зайдите в неё. Перед вами откроется страница предварительных настроек виджета:

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

Выберите количество комментариев, которое будет показано под формой; все записи сверх выбранного числа будут скрыты под кнопкой «Показать ещё».

Можно поставить галочку в чекбоксе «Включить расширенные комментарии». Кликните по ссылке «Подробнее», откроется список типов контента, которые пользователи смогут оставлять в своих комментах. Если снять галочку, то можно будет только писать текст.

Поле «Ширина» управляет размером формы ввода, она может быть актуальна для широких шаблонов.

Обратите внимание, что во время редактирования всех этих параметров пример формы, который выводится в нижней части, будет автоматически меняться – принимать нужный вид в соответствии с настройками.

Результатом всех ваших действий будет готовый фрагмент виджета в окне «Код для вставки». Что с ним делать, написано прямо в нём. Верхняя часть кода отмечена таким комментарием:

Всё, что ниже (можно и вместе с этой строчкой) необходимо скопировать (Ctrl+C) и вставить (Ctrl+V) в заголовок соответствующего файла в шаблоне вашего сайта. Если у вас самый популярный движок WordPress, то это файл header.php, он находится в папке с вашей темой. Вставить фрагмент нужно в любом месте между тегами и .

Кроме этого, в секцию нужно вставить дополнительные строки. О них сказано в документации виджета (ссылка сразу под окном формирования кода). Речь идёт о файле openapi.js и об инициализации Open API:

Вторая часть фрагмента начинается строчкой:

Её нужно разместить в том месте страницы, где требуется вывести форму и комменты. Обычно это – самый низ страницы, после текста статьи. Для WordPress это файл single.php.

Источник

Виджет комментариев вконтакте для вашего сайта и хранение количества комментариев на сервере

Двигаясь в ногу со временем, я решил разместить на своем сайте виджет комментариев «Вконтакте». Немного терпения, гугла и документации вполне достаточно для того чтобы достичь результата. Разместить сам виджет не составляет никакого труда, вконтакте предоставляет простой интерфейс генерирующий код для сайта. Мне хотелось в некоторых местах отображать количество комментариев. Тут и возникли сложности, как обычно это бывает, дьявол кроется в мелочах. Я попробую разложить по полочкам то, о чём умалчивает документация.

1.Регистрация cайта вконтакте

Чтобы разместить сам виджет, сначала сайт следует зарегистрировать как приложение Вконтакте >>здесь. Заполняем форму, получаем СМС, еще раз заполняем форму, в результате регистрации приложения мы должны получить два ключа:

api_id — идентификатор нашего сайт как приложения в вконтакте

api_secret — секретный ключ, который знает только владелец приложения. По нему шифруются данные, которые иначе могут быть подменены/испорчены/искажены злоумышленником, для генерации электронной подписи к этим данным на стороне вконтакте, нам он нужен, для того чтобы проверять их на достоверность. И да, он нам тоже понадобится в дальнейшем.

P.S: Вконтакте предоставляет упрощенный способ регистрации приложения для виджета «Комментарии», но в этом случае невозможно получить ключ api_secret(по крайней мере я битый час искал способ его получить и… не нашёл), который необходим в случае хранения количества комментариев. Поэтому не ленимся и создаём приложение.

2.Создание виджета

Создаём сам виджет, не имею желания дублировать документацию к виджету, скажу что в итоге должно получиться что-то вроде этого:

что такое onChange, читайте дальше; Третий параметр — это ID данного виджета(блока) комментариев, если его не указывать в качестве id используется md5-хэш от location.href(ссылки на эту страницу). Мне это не подошло, так как на один элемент у меня указывало несколько разных ссылок. На этой стадии виджет уже работает, теперь нужно сообразить отображение количества комментариев.

3.Передача данных о количестве комментариев на сервер

Очевидно, что самым удачным вариантом является хранение количества комментариев в базе данных, даже если мы не храним сами комментарии, так как получение количества комментариев через API вконтакте будет слишком сильно тормозить работу сайта. Я храню количество комментариев в отдельном столбце таблицы с данными. Вопрос только в том, как держать в базе значение в обновленном состоянии и избежать рассинхронизации.
API виджета комментария имеет параметр onChange. Функция, которую содержит параметр onChange, вызывается каждый раз при событии удаления/создания комментария. Колбек-функция onChange вызывается с четырьмя параметрами

num — количество комментариев
last_comment — последний комментарий
date — дата
sign — ключ

Это нам и нужно. Теперь пишем саму функцию addCommentCallback, она будет делать ajax запрос, передавая все 4 параметра выше, а также id записи на сервер. Вот что получилось у меня(используется jquery):

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

4.Валидация данных

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

php-код, обрабатывающий запрос, и пишущий в базу количество комментариев:

Вот и всё! При желании, можно в базу сохранять не только количество комментариев, но и сами комментарии. Надеюсь что статья оказалась полезной и я не потратил зря время.

Источник