Anuncios intersticiales

  • Artículo

Advertencia

A partir del 1 de junio de 2020, se apagará la plataforma de monetización de Microsoft Ad para aplicaciones para UWP de Windows. Más información

En este tutorial se muestra cómo incluir anuncios intersticiales en aplicaciones y juegos de Plataforma universal de Windows (UWP) para Windows 10 y Windows 11. Para obtener proyectos de muestra completos que muestran cómo agregar anuncios intersticiales a aplicaciones de JavaScript y HTML y aplicaciones XAML con C# y C++, consulta las muestras de publicidad en GitHub.

¿Qué son los anuncios intersticiales?

A diferencia de los anuncios de banner estándar, que se limitan a una parte de una interfaz de usuario en una aplicación o juego, los anuncios intersticiales se muestran en toda la pantalla. Con frecuencia se usan dos formas básicas en los juegos.

  • Con anuncios Paywall, el usuario debe ver un anuncio en algún intervalo periódico. Por ejemplo, entre niveles del juego:

    whatisaninterstitial

  • Con los anuncios basados en recompensas , el usuario busca explícitamente alguna ventaja, como una sugerencia o un tiempo adicional para completar el nivel, e inicializa el anuncio a través de la interfaz de usuario de la aplicación.

Proporcionamos dos tipos de anuncios intersticiales para usarlos en tus aplicaciones y juegos: anuncios de vídeo intersticiales y anuncios de banner intersticiales.

Nota

La API para anuncios intersticiales no controla ninguna interfaz de usuario excepto en el momento de la reproducción de vídeo. Consulta las prácticas recomendadas para anuncios intersticiales para obtener instrucciones sobre qué hacer y qué evitar cuando pienses en cómo integrar anuncios intersticiales en la aplicación.

Requisitos previos

Integrar un anuncio intersticial en la aplicación

Para mostrar anuncios intersticiales en tu aplicación, sigue las instrucciones para el tipo de proyecto:

XAML/.NET

En esta sección se proporcionan ejemplos en C#, pero Visual Basic y C++ también son compatibles con proyectos XAML/.NET. Para obtener un ejemplo de código C# completo, consulta Código de ejemplo de anuncios intersticiales en C#.

  1. Abra el proyecto en Visual Studio.

    Nota

    Si usa un proyecto existente, abra el archivo Package.appxmanifest en el proyecto y asegúrese de que la funcionalidad Internet (cliente) esté seleccionada. Tu aplicación necesita esta funcionalidad para recibir anuncios de prueba y anuncios en directo.

  2. Si el destino del proyecto es Cualquier CPU, actualiza el proyecto para que use una salida de compilación específica por arquitectura (por ejemplo, x86). Si el destino del proyecto es Cualquier CPU, no podrás agregar una referencia a la biblioteca de publicidad de Microsoft correctamente a través de los siguientes pasos. Para obtener más información, consulta Errores de referencia derivados de orientar el proyecto a Cualquier CPU.

  3. Agregue una referencia al SDK de Microsoft Advertising en el proyecto:

    1. En la ventana Explorador de soluciones, haga clic con el botón derecho en Referencias y seleccione Agregar referencia...
    2. En Administrador de referencias, expande Universal Windows, haz clic en Extensiones y, después, selecciona la casilla junto a Microsoft Advertising SDK for XAML (versión 10.0).
    3. En el Administrador de referencias, haz clic en Aceptar.

  4. En el archivo de código adecuado de la aplicación (por ejemplo, en MainPage.xaml.cs o un archivo de código para otra página), agrega la siguiente referencia de espacio de nombres.

    using Microsoft.Advertising.WinRT.UI;

  5. En una ubicación adecuada de tu aplicación (por ejemplo, en MainPage o en otra página), declara un objeto InterstitialAd y varios campos de cadenas que representen el id. de aplicación y el id. de unidad del anuncio intersticial. En el ejemplo de código siguiente se asignan los myAppId campos y myAdUnitId a los valores de prueba para los anuncios intersticiales.

    Nota

    Cada InterstitialAd tiene una unidad de anuncios correspondiente que usan nuestros servicios para servir anuncios al control, y cada unidad de anuncios consta de un identificador de unidad de anuncio e id. de aplicación. En estos pasos, se asignan valores de identificador de unidad de anuncio de prueba y de id. de aplicación al control. Estos valores de prueba solo se pueden usar en una versión de prueba de la aplicación. Antes de publicar la aplicación en la Tienda, debes reemplazar estos valores de prueba por valores dinámicos del Centro de partners.

    InterstitialAd myInterstitialAd = null;
string myAppId = "d25517cb-12d4-4699-8bdc-52040c712cab";
string myAdUnitId = "test";

  6. En el código que se ejecuta en el inicio (por ejemplo, en el constructor de la página), crea una instancia del objeto InterstitialAd y conecta controladores de eventos para los eventos del objeto.

    myInterstitialAd = new InterstitialAd();
myInterstitialAd.AdReady += MyInterstitialAd_AdReady;
myInterstitialAd.ErrorOccurred += MyInterstitialAd_ErrorOccurred;
myInterstitialAd.Completed += MyInterstitialAd_Completed;
myInterstitialAd.Cancelled += MyInterstitialAd_Cancelled;

  7. Si quieres mostrar un anuncio de vídeo intersticial : aproximadamente entre 30 y 60 segundos antes de necesitar el anuncio, usa el método RequestAd para capturar previamente el anuncio. Esto deja tiempo suficiente para solicitar y preparar el anuncio antes de que deba mostrarse. Asegúrese de especificar AdType.Video para el tipo de anuncio.

    myInterstitialAd.RequestAd(AdType.Video, myAppId, myAdUnitId);

    Si quieres mostrar un anuncio de banner intersticial : aproximadamente entre 5 y 8 segundos antes de necesitar el anuncio, usa el método RequestAd para capturar previamente el anuncio. Esto deja tiempo suficiente para solicitar y preparar el anuncio antes de que deba mostrarse. Asegúrese de especificar AdType.Display para el tipo de anuncio.

    myInterstitialAd.RequestAd(AdType.Display, myAppId, myAdUnitId);

  8. En el punto del código en el que desea mostrar el vídeo intersticial o el anuncio de banner intersticial, confirme que InterstitialAd está listo para mostrarse y, a continuación, mostrarlo mediante el método Show .

    if (InterstitialAdState.Ready == myInterstitialAd.State)
{
    myInterstitialAd.Show();
}

  9. Define los controladores de eventos para el objeto InterstitialAd.

    void MyInterstitialAd_AdReady(object sender, object e)
{
    // Your code goes here.
}

void MyInterstitialAd_ErrorOccurred(object sender, AdErrorEventArgs e)
{
    // Your code goes here.
}

void MyInterstitialAd_Completed(object sender, object e)
{
    // Your code goes here.
}

void MyInterstitialAd_Cancelled(object sender, object e)
{
    // Your code goes here.
}

  10. Compila y prueba la aplicación para confirmar que muestra los anuncios de prueba.

HTML/JavaScript

En las instrucciones siguientes se supone que ha creado un proyecto de Windows universal para JavaScript en Visual Studio y que tiene como destino una CPU específica. Para obtener un ejemplo de código completo, consulta Código de ejemplo de anuncios intersticiales en JavaScript.

  1. Abra el proyecto en Visual Studio.

  2. Si el destino del proyecto es Cualquier CPU, actualiza el proyecto para que use una salida de compilación específica por arquitectura (por ejemplo, x86). Si el destino del proyecto es Cualquier CPU, no podrás agregar una referencia a la biblioteca de publicidad de Microsoft correctamente a través de los siguientes pasos. Para obtener más información, consulta Errores de referencia derivados de orientar el proyecto a Cualquier CPU.

  3. Agregue una referencia al SDK de Microsoft Advertising en el proyecto:

    1. En la ventana Explorador de soluciones, haga clic con el botón derecho en Referencias y seleccione Agregar referencia...
    2. En el Administrador de referencias, expande Universal Windows, haz clic en Extensiones y, después, selecciona la casilla junto a Microsoft Advertising SDK for JavaScript (versión 10.0).
    3. En el Administrador de referencias, haz clic en Aceptar.

  4. En la <sección head> del archivo HTML del proyecto, después de las referencias de JavaScript del proyecto de default.css y default.js, agregue la referencia a ad.js.

    <script src="//Microsoft.Advertising.JavaScript/ad.js"></script>

  5. En un archivo .js del proyecto, declara un objeto InterstitialAd y varios campos que contengan el id. de aplicación y el id. de unidad para tu anuncio intersticial. En el ejemplo de código siguiente se asignan los applicationId campos y adUnitId a los valores de prueba para los anuncios intersticiales.

    Nota

    Cada InterstitialAd tiene una unidad de anuncios correspondiente que usan nuestros servicios para servir anuncios al control, y cada unidad de anuncios consta de un identificador de unidad de anuncio e id. de aplicación. En estos pasos, se asignan valores de identificador de unidad de anuncio de prueba y de id. de aplicación al control. Estos valores de prueba solo se pueden usar en una versión de prueba de la aplicación. Antes de publicar la aplicación en la Tienda, debes reemplazar estos valores de prueba por valores dinámicos del Centro de partners.

    var interstitialAd = null;
var applicationId = "d25517cb-12d4-4699-8bdc-52040c712cab";
var adUnitId = "test";

  6. En el código que se ejecuta en el inicio (por ejemplo, en el constructor de la página), crea una instancia del objeto InterstitialAd y conecta controladores de eventos para el objeto.

    interstitialAd = new MicrosoftNSJS.Advertising.InterstitialAd();
interstitialAd.onErrorOccurred = errorOccurredHandler;
interstitialAd.onAdReady = adReadyHandler;
interstitialAd.onCancelled = cancelledHandler;
interstitialAd.onCompleted = completedHandler;

  7. Si quieres mostrar un anuncio de vídeo intersticial : aproximadamente entre 30 y 60 segundos antes de necesitar el anuncio, usa el método RequestAd para capturar previamente el anuncio. Esto deja tiempo suficiente para solicitar y preparar el anuncio antes de que deba mostrarse. Asegúrese de especificar InterstitialAdType.video para el tipo de anuncio.

    if (interstitialAd) {
    interstitialAd.requestAd(MicrosoftNSJS.Advertising.InterstitialAdType.video, applicationId, adUnitId);
}

    Si quieres mostrar un anuncio de banner intersticial : aproximadamente entre 5 y 8 segundos antes de necesitar el anuncio, usa el método RequestAd para capturar previamente el anuncio. Esto deja tiempo suficiente para solicitar y preparar el anuncio antes de que deba mostrarse. Asegúrese de especificar InterstitialAdType.display para el tipo de anuncio.

    if (interstitialAd) {
    interstitialAd.requestAd(MicrosoftNSJS.Advertising.InterstitialAdType.display, applicationId, adUnitId);
}

  8. En el punto del código donde quieras mostrar el anuncio, confirma que InterstitialAd está listo para mostrarse y, después, muéstralo con el método Show.

    if (interstitialAd && interstitialAd.state === MicrosoftNSJS.Advertising.InterstitialAdState.ready) {
    interstitialAd.show();
}

  9. Define los controladores de eventos para el objeto InterstitialAd.

    function adReadyHandler(sender) {
  // Your code goes here.
}

function errorOccurredHandler(sender, args) {
  // Your code goes here.
}

function completedHandler(sender) {
  // Your code goes here.
}

function cancelledHandler(sender) {
  // Your code goes here.
}

  10. Compila y prueba la aplicación para confirmar que muestra los anuncios de prueba.

C++ (DirectX Interop)

En este ejemplo se supone que ha creado un proyecto directX y aplicación XAML (Windows universal) de C++ en Visual Studio y que tiene como destino una arquitectura de CPU específica.  

  1. Abra el proyecto en Visual Studio.

  2. Agregue una referencia al SDK de Microsoft Advertising en el proyecto:

    1. En la ventana Explorador de soluciones, haga clic con el botón derecho en Referencias y seleccione Agregar referencia...
    2. En Administrador de referencias, expande Universal Windows, haz clic en Extensiones y, después, selecciona la casilla junto a Microsoft Advertising SDK for XAML (versión 10.0).
    3. En el Administrador de referencias, haz clic en Aceptar.

  3. En un archivo de encabezado apropiado para tu aplicación (por ejemplo, DirectXPage.xaml.h), declara un objeto InterstitialAd y los métodos de controlador de eventos relacionados.

    Microsoft::Advertising::WinRT::UI::InterstitialAd^ m_interstitialAd;
void OnAdReady(Object^ sender, Object^ args);
void OnAdCompleted(Object^ sender, Object^ args);
void OnAdCancelled(Object^ sender, Object^ args);
void OnAdError(Object^ sender, Microsoft::Advertising::WinRT::UI::AdErrorEventArgs^ args);

  4. En el mismo archivo de encabezado, declara varios campos de cadena que representen el id. de aplicación y el id. de unidad para tu anuncio intersticial. En el ejemplo de código siguiente se asignan los myAppId campos y myAdUnitId a los valores de prueba para los anuncios intersticiales.

    Nota

    Cada InterstitialAd tiene una unidad de anuncios correspondiente que usan nuestros servicios para servir anuncios al control, y cada unidad de anuncios consta de un identificador de unidad de anuncio e id. de aplicación. En estos pasos, se asignan valores de identificador de unidad de anuncio de prueba y de id. de aplicación al control. Estos valores de prueba solo se pueden usar en una versión de prueba de la aplicación. Antes de publicar la aplicación en la Tienda, debes reemplazar estos valores de prueba por valores dinámicos del Centro de partners.

    Platform::String^ myAppId = L"d25517cb-12d4-4699-8bdc-52040c712cab";
Platform::String^ myAdUnitId = L"test";

  5. En el archivo .cpp donde quieras agregar código para mostrar un anuncio intersticial, agrega la siguiente referencia de espacio de nombres. En los siguientes ejemplos se supone que agregas el código al archivo DirectXPage.xaml.cpp de tu aplicación.

    using namespace Microsoft::Advertising::WinRT::UI;

  6. En el código que se ejecuta en el inicio (por ejemplo, en el constructor de la página), crea una instancia del objeto InterstitialAd y conecta controladores de eventos para los eventos del objeto. En el siguiente ejemplo, InterstitialAdSamplesCpp es el espacio de nombres para el proyecto; cambia este nombre si es necesario en tu código.

    m_interstitialAd = ref new InterstitialAd();         
m_interstitialAd->AdReady += ref new Windows::Foundation::EventHandler<Platform::Object ^>
    (this, &InterstitialAdSamplesCpp::DirectXPage::OnAdReady);
m_interstitialAd->Completed += ref new Windows::Foundation::EventHandler<Platform::Object ^>
    (this, &InterstitialAdSamplesCpp::DirectXPage::OnAdCompleted);
m_interstitialAd->Cancelled += ref new Windows::Foundation::EventHandler<Platform::Object ^>
    (this, &InterstitialAdSamplesCpp::DirectXPage::OnAdCancelled);
m_interstitialAd->ErrorOccurred += ref new
    Windows::Foundation::EventHandler<Microsoft::Advertising::WinRT::UI::AdErrorEventArgs ^>
    (this, &InterstitialAdSamplesCpp::DirectXPage::OnAdError);

  7. Si quieres mostrar un anuncio de vídeo intersticial : aproximadamente entre 30 y 60 segundos antes de necesitar el anuncio intersticial, usa el método RequestAd para capturar previamente el anuncio. Esto deja tiempo suficiente para solicitar y preparar el anuncio antes de que deba mostrarse. Asegúrese de especificar AdType::Video para el tipo de anuncio.

    m_interstitialAd->RequestAd(AdType::Video, myAppId, myAdUnitId);

    Si quieres mostrar un anuncio de banner intersticial : aproximadamente entre 5 y 8 segundos antes de necesitar el anuncio, usa el método RequestAd para capturar previamente el anuncio. Esto deja tiempo suficiente para solicitar y preparar el anuncio antes de que deba mostrarse. Asegúrese de especificar AdType::D isplay para el tipo de anuncio.

    m_interstitialAd->RequestAd(AdType::Display, myAppId, myAdUnitId);

  8. En el punto del código donde quieras mostrar el anuncio, confirma que InterstitialAd está listo para mostrarse y, después, muéstralo con el método Show.

    if ((InterstitialAdState::Ready == m_interstitialAd->State))
{
    m_interstitialAd->Show();
}

  9. Define los controladores de eventos para el objeto InterstitialAd.

    void DirectXPage::OnAdReady(Object^ sender, Object^ args)
{
    // Your code goes here.
}


void DirectXPage::OnAdCompleted(Object^ sender, Object^ args)
{
    // Your code goes here.
}

void DirectXPage::OnAdCancelled(Object^ sender, Object^ args)
{
    // Your code goes here.
}

void DirectXPage::OnAdError(Object^ sender, Microsoft::Advertising::WinRT::UI::AdErrorEventArgs^ args)
{
    // Your code goes here.
}

  10. Compila y prueba la aplicación para confirmar que muestra los anuncios de prueba.

Publicación de la aplicación con anuncios en directo

  1. Asegúrate de que tu uso de anuncios intersticiales en tu aplicación sigue nuestras directrices para anuncios intersticiales.

  2. En el Centro de partners, vaya a la página Anuncios desde la aplicación y cree una unidad de anuncios. Para el tipo de unidad de anuncio, elija Vídeo intersticial o Banner intersticial, en función del tipo de anuncio intersticial que se muestre. Anota el identificador de unidad de anuncio y el identificador de la aplicación.

    Nota

    Los valores de identificador de aplicación para unidades de anuncios de prueba y unidades de anuncios para UWP activos tienen distintos formatos. Los valores de identificador de aplicación de prueba son GUID. Cuando creas una unidad de anuncios para UWP activa en el Centro de partners, el valor de id. de aplicación de la unidad de anuncios siempre coincide con el id. de la Tienda para tu aplicación (un valor de id. de la Tienda de ejemplo es similar a 9NBLGGH4R315).

  3. Opcionalmente, puedes habilitar la mediación de anuncios para InterstitialAd mediante la configuración de la sección Configuración de mediación de la página Anuncios desde la aplicación . La mediación de anuncios te permite maximizar tus capacidades de promoción de anuncios y anuncios de anuncios mostrando anuncios de varias redes publicitarias, incluidos anuncios de otras redes publicitarias de pago, como Tabúla y Smaato y anuncios para campañas de promoción de aplicaciones de Microsoft.

  4. En el código, reemplace los valores de la unidad de anuncios de prueba por los valores dinámicos que generó en el Centro de partners.

  5. Envíe la aplicación a la Tienda mediante el Centro de partners.

  6. Revise los informes de rendimiento de publicidad en el Centro de partners.

Administrar unidades de anuncios para varios controles de anuncios intersticiales en la aplicación

Puede usar varios controles InterstitialAd en una sola aplicación. En este escenario, se recomienda asignar una unidad de anuncio diferente a cada control. El uso de diferentes unidades de anuncios para cada control permite configurar por separado las opciones de mediación y obtener datos discretos de informes para cada control. Esto también permite a nuestros servicios optimizar mejor los anuncios que atienden a su aplicación.

Importante

Puedes usar cada unidad de anuncio en una sola aplicación. Si usas una unidad de anuncios en más de una aplicación, no se servirán anuncios para esa unidad de anuncios.