# Tilda

{% embed url="<https://rutube.ru/video/c5ead3e56d17eefae013c1bf03203df7/>" %}

{% embed url="<https://youtu.be/Vzbm-T04yRU>" %}

Мы любим :heart: Tilda и не скрываем это.

У платформ для создания сайтов обычно есть свои блоки для создания веб форм, но они не интегрированы с CRM.&#x20;

Мы создали во FreshOffice **Конструктор веб форм**, который позволяет устанавливать формы на любой конструктор сайтов, любых платформ, в любом количестве, но в этой инструкции мы расскажем как это сделать именно в Tilda.

После регистрации посетителя сайта через формы FreshOffice, наши формы сделают все необходимое:&#x20;

* [x] Добавят компанию в CRM
* [x] Добавят информацию об источнике лида
* [x] Обогатят данными карточку, если участвовали рекламные кампании и реферальные ссылки
* [x] Запустят тригерную Автоматизацию

## &#x20;Как на Тильда разместить наши формы?

1. Вариант. Используем блок "вставка thml-кода"
2. Вариант. Используем Zero блок

Прежде чем начать работать с Tilda, во FreshOffice необходимо создать форму, настроить ее вид, прописать условия по лидогенерации и не забудьте позаботиться об автоответчике для клиента.&#x20;

{% content-ref url="view" %}
[view](https://help.myfreshcloud.com/integration/webform/view)
{% endcontent-ref %}

{% content-ref url="lead\_generation" %}
[lead\_generation](https://help.myfreshcloud.com/integration/webform/lead_generation)
{% endcontent-ref %}

{% content-ref url="auto\_answer" %}
[auto\_answer](https://help.myfreshcloud.com/integration/webform/auto_answer)
{% endcontent-ref %}

После этого готовый код из FreshOffice копируем и переходим в Tilda в свой аккаунт.

### Вариант 1. Вставка html-кода

Пример как может выглядеть форма на сайте (фон, расположение и прочее как пример)

![](https://3485554988-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-MSN3oAZUyyVkTgcYxfX%2F-Mf9OV8hbTVg7qHLMI2k%2F-Mf9RKDfSlTq7mWu1aav%2Fhtml_tilda.png?alt=media\&token=52791341-77f9-48c8-9348-7d871dbaa3af)

Самый быстрый и простой способ для создания такой формы. У Tilda есть на этот случай своя инструкция.

{% embed url="<https://help-ru.tilda.cc/html>" %}

### Вариант 2. Zero блок для искушенных.

Например вы хотите создать в одной области (полоса сайта): слева форма, а справа текст и изображение

![](https://3485554988-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-MSN3oAZUyyVkTgcYxfX%2F-Mf9K7fVn98W_4-jrOGe%2F-Mf9MuvZmkEn7ThgBJ5R%2Fzero2.png?alt=media\&token=221b9236-4723-46ef-a061-65d5bd5bebc0)

* [x] Создайте в в Tilda нулевой блок
* [x] далее нажимаем на кнопку Редактировать блок
* [x] Внутри блока в верхнем левом углу нажимаем на круглую кнопку :heavy\_plus\_sign:&#x20;
* [x] в появившейся серой области вставляем код из FreshOffice

![](https://3485554988-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-MSN3oAZUyyVkTgcYxfX%2F-Mf9IzvqMef4HnJ3PCtv%2F-Mf9K4JAX-_fz04d0bCW%2Fzero1.png?alt=media\&token=50f4b846-168e-48e1-bd91-f4c8f4846649)

После этого необходимо адаптировать раздел под все устройства. Более подробно об этом вы можете почитать на сайте Tilda.

{% embed url="<https://help-ru.tilda.cc/zero>" %}