# Как установить Webstoryz виджет на Tilda? ![](https://231294129-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-MXbF1r5INUqNUhrFY_u%2F-MXkC0NpeltZnXIiWYp_%2F-MXkiAh11PsAmHuOVmNL%2Ftilda%20new.png?alt=media\&token=29ed65aa-6e05-4657-8d6f-7b8b38717f16) {% hint style="warning" %} Перед установкой виджета на сайт вы должны [прикрепить к виджету хотя бы одну сторис](https://help.webstoryz.com/sozdanie-i-nastroyka-stories/kak-prikrepit-storis-k-vidzhetu). {% endhint %} Установить Webstoryz виджет на сайт, сделанный с помощью [Tilda](https://tilda.cc/ru/) можно двумя способами: * [Используя блок **HTML-код (T123)**](#ustanovka-vidzheta-s-pomoshyu-bloka-html-kod) * [С помощью **Нулевого блока (Zero-block)**](#ustanovka-vidzheta-s-pomoshyu-nulevogo-bloka) ## Установка виджета с помощью блока HTML-код Данным способом можно установить виджет как на конкретной странице сайта, так и сразу на всех страницах, используя **Header** и **Footer** в Tilda. ### Установка на одной странице 1 .Откройте нужную страницу в Tilda 2\. Добавьте новый блок ![Значок + появляется при наведении на пунктирную линию](https://231294129-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-MXbF1r5INUqNUhrFY_u%2F-MXkC0NpeltZnXIiWYp_%2F-MXkogfPouObRkZ2FHDG%2Fimage.png?alt=media\&token=c0366ef9-ca58-4305-820a-18aa8b2a740e) 3\. Пролистайте Библиотеку блоков вниз, и нажмите на **Другое** ![](https://231294129-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-MXbF1r5INUqNUhrFY_u%2F-MXkC0NpeltZnXIiWYp_%2F-MXkpL4LlxvqatVOWBs6%2Fimage.png?alt=media\&token=e9ab1eaf-50fd-411c-ae93-2ecb728a43f3) 4\. Выберите блок **(Т123) HTML-код** ![](https://231294129-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-MXbF1r5INUqNUhrFY_u%2F-MXks5Xhek44vA3H4R78%2F-MXksQGhQYz77EKqwKSi%2Fimage.png?alt=media\&token=53749008-e784-4d6e-88e5-e31b40aaadac) 5**.** В появившемся блоке нажмите на красную кнопку **Контент** ![](https://231294129-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-MXbF1r5INUqNUhrFY_u%2F-MXks5Xhek44vA3H4R78%2F-MXksmtzWoEYvO-Ffng-%2Fimage.png?alt=media\&token=12700acd-4d15-473b-b41c-d01ceb91359a) 6\. В открывшимся окне вставьте скопированный код виджета (его можно получить в разделе [**Мои виджеты**](https://widget.webstoryz.com/my-widgets), нажав на кнопку **Код виджета**) и нажмите **Сохранить и закрыть** ![](https://231294129-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-MXbF1r5INUqNUhrFY_u%2F-MXks5Xhek44vA3H4R78%2F-MXktBzD-HzliFqWfTCE%2Fimage.png?alt=media\&token=b8c2f794-8416-4ea5-8572-1e6b8a3f32ce) 7\. Нажмите **Опубликовать** ![](https://231294129-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-MXbF1r5INUqNUhrFY_u%2F-MXks5Xhek44vA3H4R78%2F-MXkta7GPQogmSuJ_LGu%2Fimage.png?alt=media\&token=9053e5ec-6db8-4867-bc36-6d5d024f23a4) ### Установка на всех страницах Для установки виджета на всех страницах вам необходимо [создать отдельную страницу в Tilda и указать ее как **Header** сайта](https://tilda.cc/ru/answers/a/header/). ## Установка виджета с помощью Нулевого блока {% hint style="info" %} Рекомендуем использовать этот способ, если вы хотите вручную настроить расположение виджета на странице, а размещение по центру вам не подходит. {% endhint %} 1 .Откройте нужную страницу в Tilda 2\. Добавьте новый блок ![Значок + появляется при наведении на пунктирную линию](https://231294129-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-MXbF1r5INUqNUhrFY_u%2F-MXkC0NpeltZnXIiWYp_%2F-MXkogfPouObRkZ2FHDG%2Fimage.png?alt=media\&token=c0366ef9-ca58-4305-820a-18aa8b2a740e) 3**.** Пролистайте Библиотеку блоков вниз, и нажмите на **Нулевой блок** ![](https://231294129-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-MXbF1r5INUqNUhrFY_u%2F-MXks5Xhek44vA3H4R78%2F-MXku_YKWoyrgrTdWQTS%2Fimage.png?alt=media\&token=b63a40e2-e493-464e-aa31-ff4c6517f638) 4\. В появившемся блоке нажмите на красную кнопку **Редактировать блок** ![](https://231294129-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-MXbF1r5INUqNUhrFY_u%2F-MXks5Xhek44vA3H4R78%2F-MXkuku9Rv6ZvOdPXm4R%2Fimage.png?alt=media\&token=7eb438e1-ea99-4a8c-9249-af1c8d80d51d) 5\. В левом верхнем углу нажмите на значок **+** ![](https://231294129-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-MXbF1r5INUqNUhrFY_u%2F-MXks5Xhek44vA3H4R78%2F-MXkut4oTm4Un0oWvOeK%2Fimage.png?alt=media\&token=aba0c286-8393-485d-9005-c8f38f5d8486) 6\. В открывшимся окне выберите **Add HTML** ![](https://231294129-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-MXbF1r5INUqNUhrFY_u%2F-MXks5Xhek44vA3H4R78%2F-MXkv7POlOuZygQC2eN_%2Fimage.png?alt=media\&token=b9d11bbb-7e4c-4ef9-bdc8-50941497b320) 7\. Дважды нажмите на появившийся блок ![](https://231294129-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-MXbF1r5INUqNUhrFY_u%2F-MXks5Xhek44vA3H4R78%2F-MXkvG8BRX8rZr-wxs-_%2Fimage.png?alt=media\&token=62ce25d5-561f-4312-b49f-66385bca7c33) 8\. В открывшимся окне вставьте скопированный код виджета (его можно получить в разделе [**Мои виджеты**](https://widget.webstoryz.com/my-widgets), нажав на кнопку **Код виджета**) и нажмите **Close & Update** ![](https://231294129-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-MXbF1r5INUqNUhrFY_u%2F-MXks5Xhek44vA3H4R78%2F-MXkvUPvyhIqzuwRG1y2%2Fimage.png?alt=media\&token=f15129a8-c777-4316-9df4-e5d9c4fae927) 9\. Настройте расположение и размер блока на свое усмотрение. Не забудьте изменить версии для мобильных и планшетов нажав на соответствующие значки сверху 10\. Нажмите **Save,** затем **Close** ![](https://231294129-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-MXbF1r5INUqNUhrFY_u%2F-MXky6qz1Mm_4w50uMya%2F-MXkyiA2Jqt2U6cqouqb%2Fimage.png?alt=media\&token=e8690a26-0133-44cc-bf37-f14bcecba718) 11\. Нажмите **Опубликовать** ![](https://231294129-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-MXbF1r5INUqNUhrFY_u%2F-MXky6qz1Mm_4w50uMya%2F-MXkyqrGLA6xOsVvYfKZ%2Fimage.png?alt=media\&token=a8b2cf8d-5545-491f-8458-09dd532d90ae) {% hint style="success" %} **Вы добавили Webstoryz виджет на свой сайт!** Если вы испытываете трудности с установкой виджета на сайт, то напишите нам в Telegram [@webstoryz\_support](https://t.me/webstoryz_support) {% endhint %}