En este artículo se proporcionan notas y ejemplos que muestran cómo mostrar un anuncio intersticial manual de un juego usando la biblioteca de Google Publisher Tag (GPT). Los intersticiales manuales de juegos son anuncios de página completa gestionados por GPT que se muestran a los usuarios mediante un activador manual.
Los siguientes eventos de GPT se utilizan para mostrar anuncios intersticiales e interactuar con ellos:
Evento | Se activa cuando... |
---|---|
|
Hay un espacio publicitario intersticial manual de un juego listo para mostrarse. Para mostrar el intersticial, llama a |
El intersticial manual del juego se puede renderizar a pantalla completa o dentro del fotograma del juego, en función de cómo se muestre el juego. Más información sobre las estructuras de los anuncios de Juegos H5
En el código de muestra que aparece a continuación, se presupone que el juego H5 se coloca directamente en el mismo marco superior que la página (con la estructura "Pantalla completa"). En ese caso, el anuncio intersticial manual también se renderizará a pantalla completa.
Sin embargo, este mismo código también funciona cuando se coloca dentro de un marco secundario (con la estructura "Iframe/WebView"). Para limitar el anuncio intersticial manual al canvas del juego H5, el juego debe colocarse en un iframe.
Ejemplo
<!doctype html>
<html>
<head>
<!-- La etiqueta Google Publisher Tag, si la hubiera, solo se hará cargo de servir anuncios fuera del juego H5. -->
<title>Página de este ejemplo de juego H5</title>
<!-- Introduzca aquí su contenido de <head>. -->
</head>
<body>
<span id="example-text">Ejemplo de juego H5</span>
<iframe src="https://www.example-game.com" title="Juego de ejemplo" Allow="autoplay">
<!-- El código de ejemplo se sirve aquí. La etiqueta Google Publisher Tag cargada en este marco solo se utilizará en el juego H5. -->
</iframe>
<body>
</html>
Notas de uso
- Para ofrecer una experiencia de usuario óptima, las etiquetas GPT solo solicitan anuncios intersticiales manuales de juegos en páginas que admitan el formato. Por este motivo,
defineOutOfPageSlot()
puede devolver un valor nulo. Compruebe este caso para asegurarse de que no está haciendo ningún trabajo innecesario. - Solicite anuncios intersticiales manuales de juegos solo en páginas o entornos en los que quiera que aparezca un intersticial. Los anuncios intersticiales manuales de juegos pueden servirse en ordenadores, tablets y dispositivos móviles.
- El intersticial aparece cuando llama a
makeGameManualInterstitialVisible
desde el eventoGameManualInterstitialSlotReady
. - Los anuncios intersticiales manuales de juegos tienen un límite de frecuencia fijo. Esto evita que el evento
gameManualInterstitialSlotReady
se active más de una vez cada 120 segundos.
Requisitos y recomendaciones
- Los anuncios intersticiales manuales de juegos generan su propio espacio publicitario. A diferencia de otros tipos de anuncios, no es necesario definir un
<div>
para los anuncios intersticiales manuales de juegos. Estos anuncios crean e insertan automáticamente su propio contenedor en la página cuando se rellena un anuncio. - Si utiliza una arquitectura de solicitud única (SRA) en una página con varios espacios, no llame a
display()
hasta que se hayan creado los divs de los espacios publicitarios estáticos. Tal como se explica en las prácticas recomendadas de Google Ads, la primera llamada adisplay()
solicita todos los espacios publicitarios definidos antes de ese momento. Aunque los espacios publicitarios para intersticiales manuales de juegos no requieren un elemento<div>
predefinido, los espacios publicitarios estáticos sí lo hacen. Si se llama adisplay()
antes de que estos elementos estén presentes en la página, se pueden generar señales de menor calidad, por lo que se recomienda retrasar la llamada inicial hasta que se hayan definido los espacios estáticos. - El traficado de intersticiales manuales requiere la misma configuración de bloques de anuncios y de líneas de pedido que los intersticiales web estándar.
Ejemplo
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Ejemplo de anuncio intersticial manual de juego</title>
<script async src="https://securepubads.g.doubleclick.net/tag/js/gpt.js"></script>
<script>
window.googletag = window.googletag || { cmd: [] };
let gameManualInterstitialSlot;
googletag.cmd.push(function () {
// Defina un espacio publicitario intersticial manual de juego.
defineGameManualInterstitialSlot();
// Defina espacios publicitarios estáticos.
staticSlot = googletag.defineSlot(
'/6355419/Travel/Europe', [100, 100], 'static-ad-1')
.addService(googletag.pubads());
// Habilite la SRA y los servicios.
googletag.pubads().enableSingleRequest();
googletag.enableServices();
});
function defineGameManualInterstitialSlot() {
gameManualInterstitialSlot = googletag.defineOutOfPageSlot(
'/6355419/Travel/Europe/France/Paris',
googletag.enums.OutOfPageFormat.GAME_MANUAL_INTERSTITIAL);
// El espacio devuelve un valor nulo si la página o el dispositivo no admite intersticiales.
if (gameManualInterstitialSlot) {
gameManualInterstitialSlot.addService(googletag.pubads());
printStatus('Waiting for interstitial to be ready...');
// Se añade un procesador de eventos para registrar el controlador de clics una vez que se haya cargado el intersticial.
// Si este evento no se activa, pruebe a borrar el almacenamiento local y a actualizar
// la página.
googletag.pubads().addEventListener('gameManualInterstitialSlotReady',
(slotReadyEvent) => {
if (gameManualInterstitialSlot === slotReadyEvent.slot) {
printStatus('Interstitial is ready.');
const button = document.getElementById('trigger');
button.style.display = 'block';
button.addEventListener('click', () => {
slotReadyEvent.makeGameManualInterstitialVisible();
printStatus('Interstitial is active.');
}, { once: true });
}
});
googletag.pubads().addEventListener('gameManualInterstitialSlotClosed',
resumeGame);
}
}
function resumeGame() {
document.getElementById('trigger').style.display = 'none';
// Los espacios publicitarios intersticiales manuales de juegos son de un solo uso, así que destruya el
espacio antiguo y cree uno nuevo.
googletag.destroySlots([gameManualInterstitialSlot]);
defineGameManualInterstitialSlot();
googletag.display(gameManualInterstitialSlot);
}
function printStatus(status) {
document.getElementById('status').innerText = status;
}
</script>
<style>
button {
display: none;
}
div.content {
position: fixed;
top: 50%;
}
</style>
</head>
<body>
<div id="static-ad-1" style="width: 100px; height: 100px;"></div>
<div class="content">
<span id="status">El intersticial manual de juegos no se admite en esta página.</span>
<p>
<button id="trigger">ACTIVAR INTERSTICIAL</button>
</p>
</div>
<script>
googletag.cmd.push(function () {
// Asegúrese de que la primera llamada para mostrar un anuncio intersticial se realice después de definir los divs
// del espacio publicitario estático.
googletag.display(staticSlot);
});
</script>
<body>
</html>