Интеграция Boomstream с Tilda: автоматический водяной знак с почтой ученика
Коротко о главном:
При встраивании плеера Boomstream на Tilda через zero-блок или HTML-блок добавьте параметр data-boomstream-use-tilda-ma=1 в код плеера. После этого во время просмотра видео будет автоматически отображаться полупрозрачный водяной знак с email ученика из его профиля Tilda. Водяной знак появляется в случайных местах экрана и защищает контент от несанкционированного распространения.
Зачем нужен автоматический водяной знак?
Водяной знак с персональными данными зрителя — один из самых эффективных методов защиты видеоконтента от пиратства и сливов. Если ученик запишет экран и выложит видео в открытый доступ, по водяному знаку можно мгновенно определить, кто именно слил контент.
Преимущества интеграции Boomstream + Tilda:
Чтобы продавать доступ к урокам, подключите продажу видео на Tilda
- Автоматическая защита — водяной знак появляется без дополнительных настроек;
- Персонализация — отображается email из профиля ученика в Tilda;
- Ненавязчивость — полупрозрачный знак не мешает просмотру;
- Случайное появление — знак возникает в разных местах экрана, что затрудняет его обрезку;
- Простота настройки — достаточно добавить одну строку в код плеера.
Пошаговая инструкция настройки
Шаг 1. Загрузите видео на Boomstream
Загрузите ваше видео в личный кабинет Boomstream любым удобным способом — через веб-интерфейс, API или загрузчик.
Совет: Подробная инструкция по загрузке видео доступна в документации Boomstream.
Шаг 2. Создайте страницу на Tilda
Создайте новую страницу на вашем сайте Tilda, где будет размещён видеоурок. Видео нужно встраивать через zero-блок или HTML-блок (прим. T123).
Важно: Автоматический водяной знак работает только в zero-блок или HTML-блок. При использовании стандартных видеоблоков Tilda или типа урока «Видео» в разделе «Курсы» необходимо ограничить доступ к контенту в личном кабинете Boomstream. После этого ученику нужно будет вручную вводить пароль, созданный на Boomstream, или свои данные для просмотра, чтобы появился водяной знак.
Шаг 3. Получите код плеера в Boomstream
- Откройте карточку загруженного видео в Boomstream.
- Перейдите во вкладку «Адаптивный».
- Настройте параметры плеера (цвет, автовоспроизведение, размер и т.д.).
- Скопируйте сгенерированный код.
Шаг 4. Добавьте специальную строчку в код плеера
Это самый важный шаг! Вставьте скопированный код в HTML-блок на Tilda и добавьте параметр data-boomstream-use-tilda-ma=1 в тег <span>.
Без этой строчки водяной знак не будет отображаться.
Пример кода плеера с добавленным параметром:
<script src="https://play.boomstream.com/ХХХХХ/config.jsonp?color=false&autoplay=1&start=3600&size=cover&title=0" async></script>
<script src="https://play.boomstream.com/assets/javascripts/biframesdk.js?v=1.1.1" async></script>
<span data-boomstream-code="ХХХХХ"
data-boomstream-mode="adaptive"
data-boomstream-use-fullscreen-mode="0"
data-boomstream-border-radius="10px"
data-boomstream-use-tilda-ma=1
></span>