Создание дополнительных действий

 

Для создания дополнительных действий применяется JavaScript. Определив дополнительное действие, вы можете использовать его повторно в своем документе.

Чтобы создать дополнительное действие:

  1. Добавьте новое событие, нажав кнопку Добавить событие в нижней части панели События.
  2. Выберите цель и событие.
  3. В разделе "Действие" выберите Пользовательское > Добавить дополнительное действие. Google Web Designer предложит вам ввести пользовательский код.
  4. Введите название действия над полем кода (после префикса gwd.).
    • Каждое дополнительное действие должно иметь уникальное название в документе.
    • Название должно быть понятным и узнаваемым.
    • Если ввести недопустимое название (например, с пробелами), поле будет подчеркнуто красным.
  5. Определите функцию в поле кода. Список свойств, событий и методов, доступных для каждого компонента, приведен в статье API компонентов.
  6. Нажмите ОК.

Событие будет использовать дополнительное действие. Это действие также можно использовать с другими событиями, которые отображаются в разделе Пользовательское.

Размер диалогового окна можно менять, перетаскивая его правый нижний угол.

Примеры

Дополнительные действия, как и пользовательские компоненты, добавляют новые функции для объявлений, создаваемых в Google Web Designer. Во всех следующих примерах элемент, к которому относится действие, определяется с помощью метода document.getElementById.

Всегда включать звук при воспроизведении видео

Добавьте следующее событие:

Цель gwd-video_1 (или идентификатор видео)
Событие Видео > Воспроизведение после паузы
Действие Пользовательское > Добавить дополнительное действие
Пользовательский код

if (document.getElementById('gwd-video_1').muted) {
document.getElementById('gwd-video_1').mute();
}

 

Чтобы использовать этот код:

  • Замените gwd-video_1 на идентификатор видео.
Отображение подписи для каждого кадра перелистываемой галереи

Добавьте следующее событие:

Цель gwd-swipegallery_1 (или идентификатор перелистываемой галереи)
Событие Перелистываемая галерея > Кадр показан
Действие Пользовательское > Добавить дополнительное действие
Пользовательский код

var gallery = document.getElementById('gwd-swipegallery_1');
var div = document.getElementById('caption-div');
var text = {
1: "The text for frame 1",
2: "The text for frame 2",
3: "The text for frame 3" };
div.textContent = text[gallery.currentIndex];

 

Чтобы использовать этот код:

  • Замените gwd-swipegallery_1 на идентификатор перелистываемой галереи.
  • Замените caption-div на идентификатор текстового элемента с подписью.
  • Замените текст подписи для каждого кадра в пользовательском коде.
Переход к следующей странице в объявлении после двухсекундной паузы

Добавьте следующее событие:

Цель page1 (или идентификатор стартовой страницы)
Событие Страница > Страница готова к показу
Действие Пользовательское > Добавить дополнительное действие
Пользовательский код

setTimeout(nextPage, 2000);
function nextPage() {
document.getElementById('pagedeck').goToNextPage();
}

 

Чтобы использовать этот код:

  • Замените page1 на идентификатор стартовой страницы.
Эта информация оказалась полезной?
Как можно улучшить эту статью?