Как установить виджет группы Вконтакте

Материал для разработчиков и веб-программистов.

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

Теперь давайте познакомимся с еще одним виджетом. Он позволяет реализовать связь между нашей группой Вконтакте, и сторонним сайтом.

Оглавление:

1. Для чего это нужно
2. Как добавить виджет группы Вконтакте на сайт
3. Заключение

Для чего это нужно

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

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

А раскрученная группа даст обратный результат — из социальной сети пользователи начнут переходить к вам на проект.

Как добавить виджет группы Вконтакте на сайт

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

https://vk.com/dev/Community

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

Давайте разбираться по пунктам.

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

Когда вы заполните все поля, будет сформирован код для вставки на сайт. Он разделен на две части.

(1 часть)
<script type="text/javascript" src="https://vk.com/js/api/openapi.js?154"></script>
(2 часть)
<!-- VK Widget -->
<div id="vk_groups"></div>
<script type="text/javascript">
VK.Widgets.Group("vk_groups", {mode: 3, no_cover: 1}, 20003922);
</script>

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

Первую часть кода нужно вставить в тело сайта, между тегами head и /head. Вторую — в том месте, где вы хотите вывести форму виджета. Сделайте это, используя программу для редактирования html кода.

Если у вас возникнут сложности, посмотрите подробный видеоурок.

Заключение

Читайте также:

• как удалить паблик в вк
• как написать человеку в вк если у него закрыта личка
• как узнать свой пароль от вк

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

Вопросы?