Utilice la plantilla de expansión en varias direcciones como punto de partida para compilar creatividades con Google Web Designer. Las creatividades expandibles en varias direcciones (MDE) pueden expandirse en la dirección adecuada en función de su ubicación en una página web. Por ejemplo, si el anuncio se encuentra en el límite derecho del navegador, el anuncio se expandirá a la izquierda. Si está en el izquierdo, se expandirá a la derecha.
Empezar
Cree en Google Web Designer un anuncio usando la plantilla de expansión en varias direcciones. Más información sobre cómo crear un anuncio a partir de una plantilla
La plantilla de expansión en varias direcciones tiene dos páginas: una página de banner y una página expandida. La de banner contiene los elementos del anuncio contraído, mientras que la expandida incluye los elementos de anuncios expandidos.
Página de banner
La página de banner incluye estos elementos:
- Botón de expansión (obligatorio): un componente Área sensible. Haga clic para que se muestre la página expandida.
- Logotipo: un componente Área sensible. Haga clic para visitar la página de destino.
- Texto de la descripción
Cambiar la página de banner
- Añada sus propias imágenes y texto a cada elemento o quite aquellos que no necesite.
- Abra el panel Eventos y añada la URL de página de destino al evento de salida del logotipo.
- col-logo-exit > acción > Salir > gwd-ad
No cambie la posición de la página expandida, ya que está centrada en la parte superior de la página de banner. Si lo hace, puede que algunos elementos no se vean o aparezcan cortados.
Página expandida
La página expandida incluye estos elementos:
- Botón de cierre (obligatorio): un componente Área sensible. Haga clic para cerrar el anuncio y que se muestre la página de banner.
- Texto de la descripción
- Reproductor de YouTube: un componente YouTube para reproducir vídeos.
- Botón de fondo: un componente Área sensible. Haga clic para visitar la página de destino.
- Botón: un componente Área sensible. Haga clic para visitar la página de destino.
Cambiar la página expandida
- Añada sus propias imágenes y texto a cada elemento o quite aquellos que no necesite.
- Abra el panel Eventos y añada la URL de página de destino a cada uno de los eventos de salida:
- bg-exp-exit > acción > Salir > gwd-ad
- btn-cta > acción > Salir > gwd-ad
Al modificar la posición de los elementos de la página expandida, actualice los valores de posición de los mismos elementos en Vista de código. De lo contrario, se omitirán las actualizaciones de posiciones cuando se expanda el anuncio.
Para actualizar valores de posición, siga estos pasos:
- Copie el valor del píxel que se encuentra en Posición y tamaño > Izquierda dentro del panel de propiedades.
- Abra la vista de código y busque el código de posicionamiento en la función
expandStartHandler. - Busque el ID del elemento coincidente y sustituya el píxel por el valor copiado.
Obtener una vista previa de forma local
Puede obtenerse una vista previa de la plantilla de expansión multidireccional igual que con cualquier otro formato de Studio. Para que este proceso le resulte cómodo, cada vez que haga clic en el botón de expansión, el anuncio se expandirá a una dirección distinta. Cuando el anuncio esté activo, la creatividad se expandirá a la dirección adecuada en función de su ubicación en la página.