ВИДЕО-ОБЗОР НА RUTUBE:
Крутой виджет с неограниченными возможностями по дизайну!
Вы также можете его использовать в качестве бокового меню.
ВНИМАНИЕ !!!
Код НЕ совместим с Автоскейлом! Это значит, что стабильная работа кода не гарантируется если на странице или в блоке используется Автоскейл (Autoscale).
 |
1 покупка навсегда! Покупаете 1 раз и можете использовать в любом количестве проектов без ограничений во времени. |
 |
Гарантия помощи При покупке кодов Вы получаете право на бесплатную техподдержку. |
Задать вопрос перед оплатой
Далее можно не читать (написано для SEO-продвижения сайта)
В интернете множество решений как сделать виджет обратной связи в Тильде, чтобы там были кнопки вотсапп, вайбер, телеграмм форма обратной связи… в общем, подобные штуки.
Но что если мы не хотим перекрывать ZERO-блоком всю нижнюю область сайта как например здесь? Я не могу листать галерею из-за невидимого ZERO-блока, на котором вот эти кнопки. Если я чуть проскроллю, галерея выползает из-под ZERO-блока, и тогда можно её листать.
А здесь – вообще невидимая форма обратной связи. Ну и третий момент – чтобы создавать подобные виджеты, приходится задействовать анимацию, и если мы назначили появление формы обратной связи при клике на эту кнопку, то больше никакой анимации элементам обратной связи мы назначить уже не сможем.
Предлагаю способ создания виджета обратной связи.
С его помощью делать виджеты очень легко. Вы просто размещаете кнопки Whatsapp, Telegram, Viber, это могут быть формы обратной связи, это может быть даже галерея или Google-карта или Яндекс-карта!… Всё, что доступно из ZERO-блока – всё это Вы можете сюда запихать абсолютно без ограничений! Создавая виджет, Вы не запутаетесь какие элементы анимировать и какие триггеры для них использовать.
Виджет скрыт за пределами экрана. ZERO-блок, на котором он располагается, ничего не перекрывает.
Вы можете создавать любые дизайны и адаптировать их под разные размеры дисплеев! И виджет на десктопной версии может выглядеть вот так, на планшете – уже вот так, а на мобильных для экономии места на экране – например. вот так.
Кроме всего перечисленного – Вы можете это использовать не в качестве виджета обратной связи, а в качестве бокового меню Вашего сайта!
Если надо чтобы виджет появлялся на всех страницах сайта, создавайте его в подвале.
Заходим в подвал и создаём ZERO-блок, в котором будет располагаться кнопка, открывающая виджет.
Всё лишнее удаляем и добавляем шейп или картинку, и ей назначаем ссылку #openwiget.
Выровняйте шейп вверх и влево, а грид-контейнеру задайте такую же высоту, как у шейпа, и сделайте сам ZERO-блок невидимым, удалив его фоновый цвет. И вот здесь Overflow = Visible.
Создаём новый ZERO-блок, и в него напихиваем кнопки, форму обратной связи, карты, галерею… Задаём грид контейнеру нужную высоту, делаем его невидимым и Overflow = Visible. Потом переходим на другие размеры дисплеев, иразмещаем элементы как хотим, и грид-контейнеру тоже задаём высоту по желанию.
Добавляем кнопку, которая будет закрывать виджет, и назначаем ссылку #closewiget
Создаём шейп, правой кнопкой мыши на нём щёлкаем и присваиваем ему имя CSS-класса = backwall (типа задняя стена).
И каких размеров будет этот шэйп – таким и будет виджет. Поэтому равняем влево и вверх и задаём ему размеры для всех дисплеев, и следим чтобы все наши элементы умещались в границах этого шейпа. После этого делаем его невидимым и перемещаем его в самый низ, чтобы он оказался под всеми элементами.
Далее добавляем на страницу из раздела Другое блок Т123 HTML, покупаем и качаем программный код и вставляем в блок Т123.
Вы можете в любое время менять дизайн Вашего виджета – и всё равно всё будет работать!
Друзья! Я очень надеюсь что с этих пор создание виджетов обратной связи на сайтах превратится для Вас в удовольствие.
Ключевые слова:
виджет обратной связи в тильде
виджет обратной связи в зеро блоке
вотсапп в тильде
вотсапп в зеро блоке
whatsapp в tilda
whatsapp в zero блоке
viber в tilda
viber в zero блоке
виджет в тильде
виджет в зеро блоке
кнопка обратной связи в тильде
кнопка обратной связи в зеро блоке
кнопка вотсапп в тильде
кнопка вайбер в тильде
тильда конструктор сайтов
tilda
тильда
тильда форма обратной связи
форма обратной связи зеро блок
виджеты для тильды
