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

виджет вк

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

группа вк

Для его размещения нам потребуется выполнить ряд действий

  1. Перейти по адресу https://vk.com/dev/Community и видим страницу подключения виджета для сообщества. Теперь нам необходимо его немного настроить
  2. В поле Ссылка на страницу: вводим адрес вашей группы. Вид — Что будет отображаться в вашем виджете, есть несколько вариантов: Участники, Новости, Только название, Не использовать обложку. Выбираем тот который вам нужен. Следующий пункт Ширина: указываем необходимую ширину блока в px если у вас не адаптивная верстка т.е. не подстраивается под различные экраны, а если верстка адаптивная, то указываем 100%. Следующее наше действие установить цвет фона, кнопки и текста думаю здесь все понятно.
  3. А сейчас самое интересное как же вставить код к себе на сайт. Если вы используете WordPress нашел самую простую установку, вам даже не понадобится знание html и css, а заключается она в следующем. Вам необходимо перейти в консоль управления сайтом -> внешний вид -> виджеты -> найти в доступных виджетах Текст и перетащить в sidebar там где у вас выводятся все виджеты (Меню, облако меток и т.д). В заголовке пишем Наша группа ВКонтакте. Далее очень важный момент в области написания кода смотрим чтобы  стоял Текст, а не Визуально потом вставляем туда наш код и нажимаем кнопку сохранить.

настройка виджета

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

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

  1. 5
  2. 4
  3. 3
  4. 2
  5. 1
(1 голос, в среднем: 5 из 5)

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