Виджеты для сайта, соц. сетей и мессенджеров
У нас более 10 виджетов, которые можно модифицировать под требования вашего бизнеса
Виджет в режиме попап-окна
В этом режиме вы можете привязать к любой кнопке вашего сайта специальную ссылку, которая откроет виджет в виде всплывающего окна (попап) поверх содержимого сайта. Как активировать режим и разместить на сайте? Размещение виджета в поп-ап окне По умолчанию виджеты vivaVision встраиваются прямо на страницу сайта. Если вы хотите открывать виджет по нажатию на кнопку или ссылку — выберите тип размещения Поп-ап окно. В этой статье описано, как переключить тип размещения и получить нужные коды. Виджет должен быть уже создан. Если вы ещё не создавали виджет — сделайте это сначала, а затем возвращайтесь к этой инструкции. Перейдите на страницу виджетов и нажмите на нужный виджет, чтобы открыть его настройки. Шаг 1 В блоке Основные настройки найдите свойство Тип размещения. По умолчанию выбрано значение На сайте. Нажмите на выпадающий список и выберите Поп-ап окно. Шаг 2 После выбора в блоке Код для вставки виджета на ваш сайт появится дополнительный параметр — ссылка для размещения в кнопке или href-ссылке. Шаг 3 Теперь вам нужно скопировать два фрагмента кода. 1. Основной код — скопируйте его и вставьте в секцию <head> вашего сайта. Шаг 4 1. Адрес обращения для вызова виджета — скопируйте его и укажите в атрибуте href ссылки или в обработчике кнопки на вашем сайте. Шаг 5 Без основного кода в <head> сайта ссылка для вызова виджета работать не будет. Убедитесь, что основной код размещён корректно, прежде чем тестировать виджет. Примеры Размещение в Tilda Добавление кода виджета в head вашего сайта 1. Перейдите в раздел Настройки сайта 2. Выберите в левом меню настроек Ещё 3. На открывшейся странице найдите блок HTML-КОД ДЛЯ ВСТАВКИ ВНУТРЬ HEAD 4. Вставьте в открывшемся окне код скопированный из виджета тут , например: Копировать <script src="https://vivacrm.ru/widgets/supersite/bookingOnSite.js"></script> 5. Нажмите Сохранить 6. Обязательно опубликуйте все страницы. Добавление URL-адреса на любую кнопку или ссылку сайта для вызова виджета 1. Откройте любую страницу вашего сайта 2. Создайте блок с кнопкой или используйте уже существующий 3. В поле "Ссылка для кнопки" добавьте URL виджета. Например: #popup — где popup, значение, которое вы можете взять из настроек виджета "Кнопка обратного вызова" или URL отображаемый в шапке настроек виджета. Опубликуйте ваши изменения Размещение кнопки в WordPress 1. Откройте редактор темы: Консоль → Внешний вид → Редактор тем 2. Выберите файл header.php 3. Вставьте перед </head> код, скопированный из настроек виджета. Например: <script src="https://vivacrm.ru/widgets/super/bookingInModal.js"></script> 4. Нажмите Обновить файл 5. Укажите на любой ссылке или кнопке URL-адрес #popup, где popup — значение из настройки виджета «Кнопка обратного вызова» или из URL в шапке настроек виджета Как разместить на самописном сайте 1. Перед </head> разместите код, который вам передал менеджер vivaCRM. Например: <script src="https://vivacrm.ru/widgets/super/bookingInModal.js"></script> 2. Укажите на любой ссылке или кнопке URL-адрес #popup, где popup — значение из настройки «Кнопка обратного вызова» или из URL в шапке настроек виджета. Например: <a href="#popup">Ваша ссылка</a> или <form action="#popup"> <button type="submit">Кнопка-ссылка</button> </form>
Виджет с отображением прямо на сайте
В этом режиме виджет будет отображаться прямо на сайте, без всплывающего окна — он будет встроен в то место, где вы его разместите. Пример виджета Размещение на Tilda 1. Откройте страницу, на которой хотите разместить виджет vivaCRM 2. Добавьте в нужное место HTML-блок (T123) 3. Нажмите Редактировать 4. Вставьте в открывшемся окне код из настроек виджета тут https://vision.vivacrm.ru/widgets, например: <script src="https://supadb.vivacrm.ru/storage/v1/object/public/widgets/4d90505d-ce07-467b-9966-adaf238bfefb.js"></script> 1. Сохраните и опубликуйте страницу. Размещение в WordPress Elementor 1. Откройте нужную страницу в режиме редактора Elementor. 2. Перетащите виджет "HTML-блок" в нужное место сайта 3. Вставьте в открывшемся окне код из настроек виджета тут https://vision.vivacrm.ru/widgets, например: <script src="https://supadb.vivacrm.ru/storage/v1/object/public/widgets/4d90505d-ce07-467b-9966-adaf238bfefb.js"></script> Размещение виджета на самописном сайте 1. Откройте код страницы, на которой хотите разместить виджет. 2. Определите место в котором вы хотите чтобы виджет появился 3. Вставьте в открывшемся окне код из настроек виджета тут https://vision.vivacrm.ru/widgets, например: <script src="https://vivacrm.ru/widgets/supersite/bookingOnSite.js"></script>