Tilda. Как создать виджеты обратной связи в zero block. WhatsApp и Telegram

Введение

Виджеты обратной связи в Zero block.

Zero Block — это удобный и простой инструмент для создания уникальных блоков в Tilda Publishing, благодаря которому пользователи могут создавать страницы, не имея специальных знаний в веб-разработке. Создание виджетов обратной связи для популярных мессенджеров, таких как WhatsApp и Telegram, может значительно улучшить опыт пользователей и помочь им быстро связаться с владельцами сайта.

Как добавить иконки виджетов обратной связи в zero block

Создание и добавление иконок виджетов обратной связи WhatsApp и Telegram в Zero Block не займет много времени и будет полезным для сайтов, где обратная связь имеет большое значение. Чтобы создать иконки виджетов, нужно выполнить следующие шаги:

1. Создайте иконки (в графическом редакторе Figma) или скачайте их с любых бесплатных сервисов (Flaticon) в SVG формате.
2. Создайте zero block и зайдите в редактор.
3. Удалите стандартный контент в блоке.
4. Нажмите на кнопку «+» и выберите «Add Image».
5. Загрузите иконку WhatsApp.
6. Точно так же загрузите иконку Telegram.

Как настроить виджеты обратной связи в zero block. Позиционирование иконок и ссылки

После того, как вы добавили иконки для виджетов обратной связи в zero block, их необходимо разместить следующим образом:

1. Задайте зеро блоку высоту в 80 пикселей в поле «grid container height».
2. Измените размеры иконок так, чтобы они не выходили за пределы видимой области блока.
3. Нажмите на иконку WhatsApp левой кнопкой мыши.
4. Нажмите на «+container» и выберите «window container».
5. В поле «AXIS X» укажите «Right», а в «AXIS Y» укажите «Bottom».
6. Одну из иконок вручную переместите чуть левее, чтобы между ними образовался отступ.
7. Эти же действия выполните и для иконки Telegram.
8. Перейдите по этой ссылке и сгенерируйте ссылку на WhatsApp.
9. Нажмите левой кнопкой мыши на иконку WhatsApp.
10. В пункт «LINK», в поле «URL» скопируйте и вставьте сгенерированную ссылку.
11. Перейдите по этой ссылке и сгенерируйте ссылку на Telegram.
12. Нажмите левой кнопкой мыши на иконку Telegram.
13. В пункт «LINK», в поле «URL» скопируйте и вставьте сгенерированную ссылку.
14. Удалите фоновую заливку зеро блока в пункте «BG COLOR».
15. Сохраните изменения и выйдите из зеро блока.

Как зафиксировать блок с виджетами при скроллинге страницы

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

1. После всех блоков вашей страницы нажмите на кнопку «+», найдите вкладку «Другое» и добавьте блок «Т123».
2. Нажмите на кнопку «Контент».
3. Скопируйте и вставьте в него следующий код:

<style>
.floating {
    width: 100%;
    position: fixed;
    bottom: 0;
    z-index: 9999;
}
</style>

<script>
$(document).ready(function () {
    var blockMenuID = '#rec00000000';
    $(blockMenuID).addClass('floating');
});
</script>

В коде, вместо «#rec00000000’» пропишите ID зеро блока с виджетами обратной связи. Сохраните изменения и опубликуйте страницу.

Заключение

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

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

Посмотрите 8 замечательных вариантов анимации текста в нашей статье.