Материал для разработчиков и веб-программистов.
Мы уже разбирали, как устанавливать комментарии вконтакте на сайт. Удобная форма, позволяющая реализовать обсуждения у себя на проекте, и получить трафик из социальной сети.
Теперь давайте познакомимся с еще одним виджетом. Он позволяет реализовать связь между нашей группой Вконтакте, и сторонним сайтом.
Оглавление:
Для чего это нужно
Виджет группы на вашем сайте будет выглядеть вот так.
Устанавливая его к себе на проект, разработчик преследует две цели. Во-первых, увеличить аудиторию своей группы. Посетители сайта, удовлетворенные предложением вашей компании, могут захотеть стать подписчиками в соц.сети. И чтобы им сделать это, достаточно в виджете нажать на кнопку «Подписаться».
А раскрученная группа даст обратный результат — из социальной сети пользователи начнут переходить к вам на проект.
Как добавить виджет группы Вконтакте на сайт
Нам нужно перейти в панель разработчика Вконтакте, и создать новый виджет. Для этого перейдите по ссылке.
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 кода.
Если у вас возникнут сложности, посмотрите подробный видеоурок.
Заключение
Читайте также:
Обратите внимание на тот факт, что в современных реалиях поискового продвижения, связь с социальными сетями — обязательное условие для успешного продвижения проекта. Поэтому устанавливать виджет вашей группы Вконтакте, жизненно необходимо.
Вопросы?
Пожалуйста, задайте свой вопрос в комментариях, с описанием возникшей проблемы
Мы и наши пользователи, регулярно обсуждаем возможные неполадки и сложности. Вместе мы разберемся с Вашей проблемой.