Call To Action (CTA)
CTA — экран с призывом к действию, который отображается поверх видео в заданные моменты. При активации воспроизведение приостанавливается.
Настройка
CTA настраивается через параметр playlist[].cta при создании плеера или через метод setPlaylistItemOptions.
Пример
function onKinescopeIframeAPIReady(playerFactory) {
playerFactory.create('player', {
url: 'https://kinescope.io/VIDEO_ID',
playlist: [{
cta: [{
id: 'subscribe-cta',
title: 'Понравилось видео?',
description: 'Подпишитесь на канал, чтобы не пропустить новые выпуски.',
skippable: true,
button: {
text: 'Подписаться',
},
trigger: {
percentages: [50],
},
}],
}],
}).then((player) => {
player.on(player.Events.CallAction, (event) => {
const ctaId = event.data.id; // 'subscribe-cta'
// Выполните необходимое действие, например откройте ссылку:
window.open('https://example.com/subscribe', '_blank');
// Закройте экран CTA и продолжите воспроизведение:
player.closeCTA();
});
});
}Параметры CTA
| Параметр | Тип | Описание |
|---|---|---|
id | string | Идентификатор CTA. Передаётся в событии CallAction. |
title | string | Заголовок. |
description | string | Описание. |
skippable | boolean | Возможность закрыть/пропустить CTA. |
button.text | string | Текст кнопки. |
button.style | CSSProperties | CSS-стили кнопки. |
trigger.percentages | number[] | Процент воспроизведения, например [0, 50, 100]. |
trigger.timePoints | number[] | Точки времени в секундах, например [60, 600]. |
trigger.pause | boolean | Показывать CTA при постановке на паузу. |
Закрытие CTA
Для программного закрытия экрана CTA вызовите метод closeCTA() у плеера. После закрытия воспроизведение продолжится.
Полное описание интерфейса см. в PlaylistItemOptions.cta.