Как добавить видео-виджет на сайт Тильда: подробный гайд

Введение

Сайты на Tilda созданы с акцентом на удобство восприятия контента. С помощью видео вы сможете добавить динамики и удерживать внимание посетителей с первых секунд. Видео-виджет на сайте не только усилит подачу информации, но и повысит вовлеченность, превращая обычных посетителей в заинтересованных клиентов.

Зачем нужен видео-виджет на Тильде

  • 🪝 Удержание внимания – видео удерживает посетителей в 2.4 раз дольше, чем текст
  • 📈 Рост конверсии – страницы с видео могут увеличивать конверсию до ~70%
  • ⏱️ SEO-преимущества – видеоконтент повышает время пребывания на сайте, что позитивно сказывается на ранжировании.
  • 🤩 Легкость восприятия – сложная информация становится нагляднее, особенно при демонстрации товаров и услуг
  • 🖐️ Доверие к бренду – видео создает эффект личного общения и делает вас ближе к клиенту

Способы добавления видео в Тильде

Все доступные способы описаны на официальном сайте Tilda, а ниже мы рассмотрим 2 самых простых и популярных способа.

Добавление видео через HTML-блок

Если вам нужен максимальный контроль над отображением, вы можете встроить видео вручную с помощью HTML-кода. Этот способ подойдет, если вы уверенно чувствуете себя в редактировании кода.

  • Добавьте на страницу блок "Т123 HTML-код" из библиотеки блоков.
  • Вставьте в него embed-код с YouTube, RUTUBE или другого видеохостинга: 
    <iframe width="560" height="315" src="https://www.youtube.com/embed/%VIDEO_ID%" frameborder="0" allowfullscreen></iframe>
  • Чтобы видео было адаптивным и корректно отображалось на любых устройствах, оберните <iframe> в контейнер: 
    <div style="position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden;"> <iframe style="position: absolute; top: 0; left: 0; width: 100%; height: 100%;" src="https://www.youtube.com/embed/%VIDEO_ID%" frameborder="0" allowfullscreen></iframe></div>
  • ✅ Плюсы: полный контроль над оформлением, отсутствие внешних зависимостей.
  • ❌ Минусы: необходимы знания HTML, сложно поддерживать, возможны трудности с адаптацией и кастомизацией.

Добавление через no-code платформу

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

  • Зарегистрируйтесь в WEBSET -> скопируйте в личном кабинете код инициализации
  • Войдите в свою учетную запись Tilda и выберите нужный сайт
  • Нажмите кнопку «Настройки сайта»
  • В левом меню перейдите в раздел «Еще»
  • В разделе «HTML-КОД ДЛЯ ВСТАВКИ ВНУТРЬ HEAD» нажмите кнопку «Редактировать код»
  • Вставьте код инициализации
  • Нажмите кнопку «Сохранить»
Теперь вы можете добавить на сайт виджеты от WEBSET. Создайте в личном кабинете виджет -> нажмите «Опубликовать» -> виджет появится на вашем сайте 💫

Часто задаваемые вопросы (FAQ)

  • Как загрузить видео mp4 в тильду?
    Чтобы загрузить видео в формате mp4 на Tilda, добавьте блок "Видео" (например, T123) или используйте зеро блок. Затем загрузите файл в "Файловый менеджер", скопируйте ссылку и вставьте её в поле для видео. Учтите, что Tilda не поддерживает встроенный видеоплеер, поэтому для корректного отображения лучше использовать сторонний хостинг или конвертировать видео в GIF. Или просто используйтей удобную платформу WEBSET.
  • Можно ли разместить видео в углу сайта?
    Да, WEBSET позволяет закрепить видео в углу экрана на сайте. Вы сможете выбрать из девяти доступных позиций, а также настроить автоматическое появление и скрытие видео.
  • Как убрать рекомендуемые видео в конце YouTube-ролика?
    YouTube показывает рекомендуемые видео после проигрывания. Чтобы отключить их, добавьте параметр ?rel=0 в URL. При использовании WEBSET такой проблемы нет — отображается лишь то видео, которое вы загрузили.