Как установить виджет "Сообщения сообщества" ВК на сайте

Установка виджета «Напишите нам»

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

Здесь всего несколько параметров для настройки. Текст кнопки, размер и ссылка на страницу, с которой будет диалог.

Для установки на сайт, копируем первый скрипт, между тегами head. А div и второй скрип в то место, где будет выводится сам виджет.

Как подключить?

Последовательность действий достаточно проста и не требует особых навыков. Чтобы подключить виджет сообщения сообщества Вконтакте, нужно открыть страничку с данными настроек: https://vk.com/dev/CommunityMessages, правильно указать ссылку на необходимую группу, скопировать сформировавшийся код и разместить на своем сайте.

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

С помощью такой простой последовательности действий, вы получаете возможность немедленно узнавать, что вам кто-то что-то написал.

Виджет «Сообщения сообщества»

Более интересным вариантом, на мой взгляд, является виджет «Сообщения сообщества» Это некое подобие онлайн консультанта. У вас на сайте располагается кнопка, при нажатии на которую раскрывается окошко с диалогом с привычным интерфейсом ВКонтакте. При этом, можно не только написать текст, но и прикрепить документ или фото.

Чтобы добавить такой виджет на сайт, у вас должна быть создано сообщество и в нем включены «Сообщения сообщества» и «Виджет сообщении». Именно здесь производятся основные настройки.

«Приветствие
» — это автоматическое сообщение, которое будет отправляться пользователю, когда он откроет диалог.
«Краткая информация
» — это текст/приветствие, которое увидит пользователь. Нужно постараться сформулировать его таким образом, чтобы побудить посетителя вашего сайта написать вам.
«Статус не в сети
» будет показан пользователю, если вы не отвечали ему в течении 30 минут.
«Разрешенные домены
» — это домены, на которых будет показан виджет.

Плюсы виджета

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

Виджет „Комментарии“.

Заходите на свою страницу ВКонтакте, слева внизу находите ссылку „Разработчикам“ и нажимаете на нее. Далее нажимаете „Показать все“. Выбираете виджет „Комментарии“.

Посетители будут видеть под статьей поле для комментариев. В графе „Сайт/приложение“ выберите — подключить новый сайт. Напишите название сайта, адрес сайта — с http:, основной домен сайта — без http, выберите тематику сайта, нажмите „сохранить“. Ширину выберите такую, чтобы умещался на странице (если что потом можно будет изменить и „подогнать“). Скопируйте код. Этот код будет состоять из двух частей.

Первая часть устанавливается в header.php перед закрывающим тегом

это копировать не надо.

VK.init ({apiId: 5815542, onlyWidgets: true});

Он находится в Вордпрес Внешний вид — редактор — header.php

Ставите прямо перед (я уже поставил — видите его выше). Нажмите «обновить файл».

Вторая часть кода

это не надо.

VK.Widgets.Comments («vk_comments», {limit: 10, width: «665», attach: «*»});

Ставится в тело страницы (Вашей статьи, записи) — внизу под страницей (в режиме текст ). Не забудьте нажать «Обновить».

Обновляем страницу сайта и смотрим ка это будет выглядеть. Если виджет шире и не умещается, возвратитесь в «конструктор виджета» и уменьшите ширину.

При введении текста и отправки комментариев они будут отражаться ниже. Также на страничке комментатора в соцсетях.

Как можно использовать виджет приветствия «ВКонтакте»

Общий совет: не пишите размыто. Пока я писала пост, успела забыть, из какого сообщества взяла этот пример.

Невнятные характеристики вроде «много интересных записей» и «много прикольных картинок» в тексте виджета не помогли мне вспомнить. Лучше писать что-то конкретное и свойственное именно вашему сообществу. По крайней мере здесь есть призыв к действию «Подпишись» — это хороший ход.

А теперь расскажу, что можно делать при помощи виджета приветствия «ВКонтакте».

Рассылка

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

ЧаВо

Ещё с помощью виджета приветствия «ВКонтакте» можно направить пользователей на страницу FAQ, чтобы вам не пришлось тысячу раз объяснять новичкам в сообщениях и комментариях одно и тоже. Вот как это сделали фанаты ручкокручения:

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

Приятные бонусы

Ещё один актуальный способ использования персональных виджетов — выдача промокодов на скидку.

В этом виджете админы группы, которая продаёт духи, применили довольно редкую переменную — число. Видите, где написано 45? Число связывается с CRM-системой магазина. С каждым проданным по акции флаконом число будет уменьшаться.

Конечно, для нас с вами было бы понятнее, если бы вместо «всего 45 ароматов» было бы написано «осталось 45 ароматов». Возьмите себе на заметку такой способ обратного отсчёта.

Конкурс

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

Только не берите с них пример написания числительных.

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

Чтобы установить виджет приветствия, идём в каталог приложений «ВКонтакте» и жмём на кнопку «Добавить» напротив нужного нам приложения Spycat.

Важно:

в настройках видимости поставьте галочку «Только для администраторов», чтобы обычные посетители не видели кнопку «Открыть приложение» рядом с обложкой сообщества. А в настройках «Видимость виджета приложения», наоборот, ставим «Все пользователи».

Пока вы создаете виджет, можете ограничить видимость только администраторами. Главное — не забыть потом открыть виджет для всех.

К счастью, Spycat подготовили удобную шпаргалку:

В текстах для виджета приветствия «ВКонтакте» можно использовать несколько переменных:

имя и фамилию: {Firstname} и {Lastname} соответственно;
город проживания: {City};
последнюю указанную в профиле профессию: {Career}.

Обратите внимание, что каждое текстовое поле имеет ограничение до 100 символов, а надпись на кнопке — до 50. Поэтому в Льва Толстого поиграть не получится.

Виджет «Мне нравится»

Кому рекомендуем:

всем сайтам.

Что даёт:

оценка успешности материала; увеличение социального охвата; можно исследовать аудиторию; отслеживать комментарии на стене пользователей, которые поделились материалом.

Станьте Project-менеджером и управляйте командой разработки!

Это та профессия в IT, в которую можно вступить без технического образования.
Здесь вы:

Получите все hard и soft skills согласно матрице компетенций PM;
Освоите методологии и фреймворки разработки (PRINCE2, PMBOK, Agile, SAFe);
А также изучите необходимую базу по математике, статистике и программированию для управления проектами.

Интересно? Тогда вам на курс Project Manager в IT от Product LIVE.

Виджет «Авторизация через „ВКонтакте“»

Кому рекомендуем:
всем сайтам, на которых есть личные кабинеты.

Что даёт:

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

В 2021 году компания Janrain опросила 600 своих клиентов. Получилась такая картина:

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

С помощью авторизации через «ВКонтакте» войти на сайт можно в несколько кликов: достаточно авторизоваться через свой аккаунт. И уже на следующем этапе (при желании) указать недостающие данные.

Виджет «Кнопка Класс».

Эта кнопка позволяет посетителям отмечать интересные статьи, записи, публикации.

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

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

Виджет «Опросы».

Заходите на свою страницу ВКонтакте, слева внизу находите ссылку «Разработчикам» и нажимаете на нее. Далее нажимаете «Показать все». Выбираете виджет «Опросы».

Хотите узнать мнение читателей о статье, записи, полноте раскрытия темы? Поставьте «Опрос». Заполняете все графы: название сайта, адрес сайта, основной домен, тематика, нажимаете «сохранить». Вписываете тему опроса, можно добавить или удалить количество (варианты) ответов. Нажимаете получить код.

Код состоит из двух частей. Устанавливается как в разделе Виджет «Комментарии». Одна часть в header.php, вторая в тело страницы под текстом.

Обновляем страницу сайта, видим виджет.

При голосовании (нажатии посетителями на ответы), их количество будет отражаться, посетители смогут еще нажать кнопку «Рассказать друзьям» и друзья узнают о голосовании.

Виджет «Рекомендации»

Кому подойдёт:

бизнесам, которые занимаются контент-маркетингом, авторам блогов.

Что даёт:

SEO-эффект, увеличение глубины просмотра и времени, проведённого на сайте; улучшение юзабилити; рост вовлечённости.

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

Как же это сделать?

3. Переходим на страницу «Мои Настройки».

4. Прокручиваем страницу вниз и в подвале сайта находим меню с ссылкой «разработчикам». Переходим по данной ссылке.

6. Перейдём в этот раздел, где будет перечислен список виджетов для сайта.

Начнём по порядку.

Виджет «Комментарии» позволяет настроить блок комментариев к статьям вашего сайта.

Переходим на страницу этого виджета.

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

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

Например, разрешить пользователю кроме текста прикреплять к своим комментариям фотографии, видео и ссылки, а рисовать графити и добавлять аудиозаписи запретить.

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

Например, если ширина области под контент равна 600 пикселей, то и ширину блока «Коммертарии» указываем аналогичную. Не беда, если вы не угадаете с шириной изначально, потом её можно будет исправить в коде вручную.

Теперь вы можете получать комментарии к своим статьям, имея гарантию, что это будут реальные люди. Так же данный виджет имеет возможность модерации (удаления сообщений, добавление отдельных пользователей в чёрный список, назначение модераторов).

Виджет «Запись на стене» — для чего он нужен? Попробую объяснить на примере.

Допустим, вы на своём блоге размещаете новость об увольнении Павла Дурова из ВКонтакте, и хотели бы процитировать его мнение по этому поводу. Вам всего-навсего необходимо найти нужную запись в социальной сети. Скопировать её URL.

Перейти на страницу виджета «Запись на стене».

Спросите зачем такие сложности, если в HTML для этого есть специальный тег «Цитата»? Отвечаю: функция данного виджета — это достоверность информации. Ваши читатели будут уверены, что информация, так сказать. из первых уст и в ней нет «отсебятины».

Виджет «Сообщества» — если вы для своего сайта завели одноимённую группу или публичную страницу Вконтакте, то можно на своём сайте для привлечения подписчиков на своём сайте установить данный виджет.

В пункте «Вид» выбираем, что будет отображаться в виджите.

Участники : фотографии подписчиков и их количество.

Только название : в виджете будет отображаться логотип вашего сообщества и его название.

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

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

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

Здесь также как и для комментариев указываем название сайта, его адрес, основной домен и тематику. Далее жмём кнопку «Сохранить».

Теперь необходимо настроить внешний вид кнопки. Здесь на ваше усмотрение. Далее выбираем высоту кнопки — для всех вариантов кнопок предложенные значения одинаковые: 18, 20, 22 или 24 пикселя. Так же если вы выбрали вариант кнопки «Кнопка с миниатюрным счётчиком» или «Кнопка с текстовым счётчиком», то можно в пункте «Название кнопки» выбрать текст, который будет отображаться на кнопке. Вариантов всего два: «Мне нравится» или «Это интересно».

Всё! Копируем код и добавляем на страницы сайта.

Следующий виджет «Рекомендации» без установки предыдущего («Мне нравится») работать не будет, так как отображает наиболее популярные статьи вашего веб-ресурса по мнению читателей. С помощью этого виджета вы сможете упростить пользователю поиск наиболее интересных постов на вашем блоге.

С первыми пунктами настройки данного виджета думаю вам о так уже всё ясно, поэтому начну с «Количества записей». Здесь вы выбираете количество отображаемых популярных страниц. Их может быть 3, 5 или 10.

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

В пункте «Формулировка» выбираем наиболее приемлемую фразу («Понравилось» или «Интересно») и вновь копируем «Код для вставки».

Виджет «Опросы». Это, пожалуй самый интересный виджет. С его помощью вы можете на своём сайте организовать опрос по любой тематике и с любым количеством вариантов ответов.

Например, вы сменили дизайн своего блога и хотите узнать мнение своих читателей. Идём в раздел виджета «Опросы». Заполняем форму (вы конечно для своего сайта описание добавляете):

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

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

Появится всплывающее окошко, из которого вы сможете скопировать Код для вставки.

После вставки кода на сайт, ваши читатели увидят вот такую форму опроса:

Хотите чтобы ссылки на ваши статьи стали бессмертными? Тогда на помощь вам придёт виджет «Публикация ссылок», позволяющий пользователям ВК публикацию ссылок на статью прямо на стену. А как известно — вся информация опубликованная на стене обязательно транслируется в новостную ленту.

Настройки данного виджета элементарные: вы выбираете стиль кнопки (с прямыми или закруглёнными краями, просто иконка или кнопка с текстом, со счётчиком публикаций или без), можете изменить текст на ней (например, заменить слово по умолчанию «Сохранить» на «Рассказать друзьям») и вариант логотипа.

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

Думаю этот виджет можно ещё использовать в том случае, если, например, вам на блог пишут статьи другие люди (как у Александра Борисова), где в конце статьи вы указываете ссылку-имя автора на его сайт. А если сайта нет? Вот тогда можно воспользоваться этим виджетом и отправлять всех желающих познакомиться с автором на его страничку в соцсети.

На этом всё! Удачных вам экспериментов!

Мы выпустили новую книгу «Контент-маркетинг в социальных сетях: Как засесть в голову подписчиков и влюбить их в свой бренд».

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

Больше видео на нашем канале — изучайте интернет-маркетинг с SEMANTICA

На сегодняшний день самыми популярными являются виджеты «Вконтакте», однако их выпускают и другие компании. Суть их в том, что пользователь получает возможность переписываться с сотрудником компании или сообществом в соцсети. Виджет может выглядеть как кнопка, а может – как окно, приглашающее к диалогу.

Виджет «Разрешить писать сообществу»

Кому рекомендуем:

бизнесам, которые занимаются контент-маркетингом, авторам блогов.

Что даёт:

рост конверсий во вступление в группу; увеличение точек касания с бизнесом.

Ещё один виджет, который может стать точкой контакта на внешнем сайте — «Разрешить писать сообществу». С помощью него можно доставлять ваши новости прямо в личные сообщения подписчика. Как результат, пользователи, подписавшиеся на новости в личных сообщениях, всегда будут в вашем информационном поле. Потенциально инструмент может составить конкуренцию традиционным почтовым рассылкам.

Как и от этичной рассылки, от новостей «в личку» легко отписаться.

Напоследок — преимущества виджетов с точки зрения владельцев и посетителей сайтов:

Настройки виджета Сообщения сообщества в ВК

Настройки виджета Сообщения сообщества

Ссылка на страницу

Выберите из списка вашу группу, от имени которой вы будете отвечать.

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

Расположение

Имеется в виду расположение виджета на сайте.

Есть варианты:

В правом нижнем углу
В левом нижнем углу

Все зависит от того, какой у вас шаблон сайта. Учтите расположение других блоков, чтобы виджет не перекрывал их.

Раскрыть через

Есть варианты:

не раскрывать;
сразу;
через 5 секунд (минимальное значение);
…
через 120 секунд (максимальное значение).

Здесь надо иметь в виду, будет ли раздражат появление виджета вашу аудиторию.

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

Так выглядит виджет в закрытом виде:

Виджет в закрытом виде

А вот так в открытом:

Виджет в открытом виде

Раскрывать со звуком

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

Звук нового сообщения

Если поставить эту галочку, то при получении от вас сообщения, виджет издаст звук.

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

Если пишете сами первые, то лучше не включайте.

Текст подсказки

Это текст рядом с закрытым виджетом. Он подсказывает пользователю для чего этот кружок. Стандартный текст, предлагаемый виджетом : «Есть вопрос?».

Используйте стандартный текст, или напишите свой.

Код для вставки

После того, как заполните все поля и скопируйте код виджета на сайт.

В зависимости от того, на какой cms у вас сайт варианты могут быть разные.

Как работают виджеты сообщений

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

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

Виджет «Публикация ссылок».

Заходите на свою страницу ВКонтакте, слева внизу находите ссылку «Разработчикам» и нажимаете на нее. Далее нажимаете «Показать все». Выбираете виджет «Публикация ссылок».

Выбираете форму кнопки, копируете код. Код состоит из двух частей и устанавливается как в разделе Виджет «Комментарии». Одна часть в header.php, вторая в тело страницы под текстом.