Вставляем виджет группы Вконтакте на WordPress
Социальные сети – это второй по доступности источник трафика для сайта после поисковых систем, и третий по эффективности. При правильном продвижении Интернет-проекта в соц.сетях можно добиться прироста посещаемости на 30%, а количество постоянных читателей до 70%!
Вот почему вебмастеры в первую очередь обращают пристальное внимание на социальные сети, создавая официальные страницы от сайта, запуская RSS трансляцию новостей. И главной российской площадкой для раскрутки своего веб-сайта или Интернет бизнеса, является сеть Вконтакте, которая предоставляет достаточные мощности для свободного старта без каких-либо вложений!
Как вставить виджет группы ВК?
Создание и продвижение группы Вконтакте не представляется сложной задачей, даже для новичков. Благодаря интуитивно-понятному интерфейсу соц.сети от Вас потребуется лишь время.
А чтобы аудитория сайта узнала о вашей социальной страничке нужно рассказать об этом любым доступным для Вас способом. И многие вебмастеры предпочитают формат виджета, который легко встраивается в веб-дизайн . ВКонтакте, как и другие социальные сети, предоставляет набор веб-инструментов, из которых можно выделить «Виджет Сообщества».
Чтобы приступить к вставке кода на страницы сайта, для начала авторизуемся на сайте ВКонтакте, и проследуем по ссылке «Разработчикам» в конце страницы:
- Найдите пункт «Авторизация и виджеты для сайта» ;
- Щёлкаем «Сообщество» — 3 пункт сверху и настраиваем отображение;
- Укажите ссылку на свою группу или паблик, так как она отображается в адресной строке;
- Выберите формат отображения: Участники, новости, только название (рекомендуем вариант «Участники», как более распространённый среди блогов и большинства крупных сайтов);
- Далее настройте габариты виджета (ширину и высоту в пикселях), и если требуется измените цветовое решение, чтобы вписать в шаблон сайта.
Далее, как только настройка окончена, копируем полученный код, который и предстоит поместить на сайте.
Первую часть кода вставляем после открывающегося тега <body>, который находится в файле «footer.php» тем WordPress. Вторую часть копируем в «Sidebar» в разделе «Внешний вид»-«Виджеты», помещая в стандартный текстовый блок. После нажатия кнопки «Сохранить» можно проверить отображение «Виджета Сообщества» на сайте.
Примечание! Скопированный код делится на две части по причине оптимизации загрузки основного контента на страницах сайта. Если у Вас минимальное использование сторонних скриптов, то при вставке кода в виджет «Текст» полностью, разница во времени будет незаметна.
Как вставить виджет ВК через iframe
Иногда может возникать проблема с правильным отображением виджета на страницах сайта, что несёт негативные последствия в процессе активного продвижения. Как оказалось, виноват скрипт виджета, который не всегда корректно обрабатывается интернет-браузерами.
Чтобы избежать таких неполадок, можно применить иной способ вывода «Виджета Сообщества», воспользовавшись кодом построенным на показе через <iframe>:
<iframe src="http://vk.com/widget_community.php?gid=53033466&width=280&height=220" width="280" height="220" scrolling="no" frameborder="0"></iframe>
В коде замените числовое значение в URL на номер ID вашей группы ВКонтакте, его можно найти в адресе стены сообщества (даже если установлено произвольное имя).
Вместо послесловия
Вот такие варианты размещения доступны для большинства современных CMS, в том числе WordPress. Обычно, вставка кода виджета сообщества дело пары минут, но бывают и исключения из правил.
Если Вы столкнулись с проблемами при размещении виджета отпишитесь в комментариях, давайте решать их вместе!
Через iframe не работает, думаю, что у меня проблемы с кавычками.
Здравствуйте!
Вполне возможно, что есть ошибка в синтаксисе кода, либо неверно введён ID сообщества. Перепроверьте данные.
Добрый вечер. Не нашел других сайтов описывающих установку виджета на Word Press и потому решил тут спросить.
Скажите, что делать с долгой загрузкой виджета? Я уже всю голову себе сломал думая над этой проблемой )) У вас тоже я смотрю он заметно замедляет скорость загрузки сайта. Как я понимаю, проблема в подгрузке аватарок с контакта. У меня сайт порой секунд 10 грузится, и все по вине именно виджета вконтакте. Подскажите как его оптимизировать!
Здравствуйте, Руслан!
В принципе время загрузки сайта зависит от многих факторов. Кстати, «виджет сообщества» не единственный скрипт притормаживающий отображение страницы, также заметно снижается скорость при подгрузке социальных кнопок и иных элементов со сторонних сайтов. Вкупе с работой десятка плагинов и не меньшего числа скриптов, и наблюдается задержка…
Решения этой проблемы не встречалось, всё-таки по причине обработки данных на удалённом сервере, задача по оптимизации тупиковая. Как вариант, лишь следовать предписанным инструкциям, размещая часть кода в «header», а другую в месте отображения.
Да, я тоже пришел к тому, что вариант лишь один — убирать скрипты. Т.е оставлять ну самые самые насущные. Вчера тестировал самые популярные развлекательные ресурсы, на которых куча виджетов и наворотов и у всех очень слабые показатели скорости загрузки. т.е все сознательно в ущерб скорости размещают скрипты? Хотя постоянно твердят, что скорость загрузки важна для поисковиков.. дилемма в общем ))
Окромя стандартных вкшных виджетов, есть разные сторониие сервисы, разной степени паршивости. Больше всего понравился ejfe.ru/widget — поддерживает вк, инстаграм, twitter в одной ленте, еще и кеширует информацию, если что то недоступно, да и выглядит прикольно. Единственный недостаток — настраивается только длина и ширина, а так же фон, хотелось бы побольше вариантов кастомизации.
Спасибо всё просто и доступно
Виджет вк на мой взгляд очень нужен, да и вообще есть совместные виджеты разных социалок с переключением на нужную, сейчас без них ни куда, по этому я за то что бы их ставить, я поставила, спасибо!
Добрый день!
не высвечивает блок вк, делал все по инструкции, у вас такая же как и на сайте вк для разработчиков. Пытался еще добавить блок комментариев, тоже самое не высвечивает блок(опять же все делал по инструкции)
Работаю на опенкарте, скачал установочный блок(уже готовый) для своей cms, та же ситуация, текстовый блок показывает а сам виджет группы не показывает.
Здравствуйте!
Можно ли сделать так, чтобы на произвольной странице сайта на Джумле отображалась бы лента новостей из группы в контакте? Добавлял код из контакта, но лента отображается только через виджет.
Здравствуйте!
Не сталкивался с реализацией подобной задачи. А почему бы не встроить виджет с отображением стены в расширенными опциями, установить размер по странице? Практически то что надо.
Не работал с Joomla, но думаю, как вариант, можно выводить записи со стены в формате RSS
Здравствуйте!
Возможно ли добавить такой виджет на сайт в конструкторе WYSIWYG Web Builder? Добавлял код в блок HTML, но никакого результата.
Здравствуйте!
Не сталкивался с озвученной CMS, но по опыту знаю, что виджет ВК работает в HTML блоках. Попробуйте вставить код полностью без распределения на 2 части.
Также, если в системе управления сайтом предусмотрен редактор шаблона (исходного кода), то попробуйте вставить код непосредственно в тело шаблона.
Вставлял код полностью в тело шаблона, разбивал на части, ничего не помогает. Даже на хостинге редактировал файл Index.
Может есть какой другой способ добавить данный виджет?
Увы, кроме скрипта есть только вариант с iFrame, описанный в статье. Если у Вас на сайте работает трансляция видео с других сайтов, например с YouTube, то есть вероятность что вариант с iframe будет работать. Ну и есть вероятность, что для вашего конструктора предусмотрен соответствующий плагин…
Разместила виджеты 2 групп, один сбоку другой в футере. На главной видно футер. Но на странице блога виджет 2 группы исчезает из футера и накладывается на виджет 1 группы. Тема the 7
Подскажите как при помощи iframe вывести новости сообщества, а не участников.?
Здравствуйте!
Увы, другие варианты подключения мне не знакомы. Виджет с отображением подписчиков вывести проще, по причине его показа — по умолчанию.
Все-таки не понял как найти этот футер файл в Теме. Как его точно найти?
Здравствуйте!
Файл Footer.php хранится в каталоге темы WordPress. Также его можно найти
в разделе «Внешний вид» -> Редактор -> Подвал (footer.php)
Приветствую. Шапку вставил в «footer.php». А вторую часть не пойму куда. Вставляю по вашей инструкции. просто как текст показывает. А хочу виджет чата из ВК. Подскажите куда вторую часть вставить, чтоб всплывало окно.
Здравствуйте!
Проверьте работоспособность скопированного кода совместно. Не разделяйте на 2 отдельных скрипта, вставьте исходное содержимое в стандартный html виджет WordPress.
привет перепробывал разные способы размещения виджета ВК на сайте уже 2й день сижу перебираю способы разные приразные
высвечивается на сайте сам код сгенерированый вместо виджета что делать?
http://artkras24.ru/
Здравствуйте!
Уточните, какая CMS у вашего сайта, и каким образом Вы вставляете код виджета? Обязательным условием является размещение кода в режиме html (исходный текст).
Здравствуйте!
подскажите пожалуйста как добавить виджет на группу в вк на сайт в вордпресс.
вставляю код в текст в разделе виджеты и отображается на странице реально только текст а не сам виджет..
Здравствуйте!
В последних версиях WordPress в разделе «Виджеты» есть отдельный виджет для вставки скриптов и кода HTML. Теперь текстовый виджет предназначен только лишь для вывода форматированного текста.