Opciones de anuncios nativos

Los anuncios nativos tienen muchas funciones avanzadas que te permiten realizar personalizaciones adicionales y crear la mejor experiencia de anuncios posible. En esta guía, te mostramos cómo usar las funciones avanzadas de los anuncios nativos.

Requisitos previos

Controles de recursos

En esta sección, se detalla cómo personalizar los recursos de creatividad en tus anuncios nativos. Tienes la opción de especificar una relación de aspecto preferida para los recursos de medios, y cómo descargar y mostrar los recursos de imagen.

Controles preferidos de relación de aspecto de medios

Los controles de la relación de aspecto multimedia te permiten especificar la relación de aspecto que prefieres aplicar a las creatividades de anuncios.

Llama a NativeAdRequest.Builder.setMediaAspectRatio() con un valor de NativeAd.NativeMediaAspectRatio.

  • Si no se establece esta configuración, los anuncios devueltos pueden tener cualquier relación de aspecto multimedia.

  • Cuando se establece esta configuración, puedes mejorar la experiencia del usuario especificando el tipo de relación de aspecto de tu preferencia.

En el siguiente ejemplo, se le indica al SDK que prefiera la devolución de una imagen o un video con una relación de aspecto específica.

Kotlin

val adRequest = NativeAdRequest.Builder(
  "ca-app-pub-3940256099942544/2247696110",
  listOf(NativeAd.NativeAdType.NATIVE))
  .setMediaAspectRatio(NativeAd.NATIVE_MEDIA_ASPECT_RATIO_LANDSCAPE)
  .build()

Java

NativeAdRequest adRequest = new NativeAdRequest.Builder(
  "ca-app-pub-3940256099942544/2247696110",
  List.of(NativeAd.NativeAdType.NATIVE))
  .setMediaAspectRatio(NativeAd.NATIVE_MEDIA_ASPECT_RATIO_LANDSCAPE)
  .build();

Control de descarga de imágenes

El control de descarga de imágenes te permite decidir si el SDK devolverá recursos de imagen o solo URIs.

Llama a NativeAdRequest.Builder.disableImageDownloading().

  • El control de descarga de imágenes está inhabilitado de forma predeterminada.

  • Cuando está inhabilitado, el SDK de anuncios de Google para dispositivos móviles (beta) propaga la imagen y el URI por ti.

  • Cuando está habilitado, en cambio, el SDK propaga solo el URI, lo que te permite descargar las imágenes reales a tu discreción.

En el siguiente ejemplo, se indica al SDK que solo devuelva el URI.

Kotlin

val adRequest = NativeAdRequest.Builder(
    "ca-app-pub-3940256099942544/2247696110",
    listOf(NativeAd.NativeAdType.NATIVE))
    .setMediaAspectRatio(NativeAd.NATIVE_MEDIA_ASPECT_RATIO_LANDSCAPE)
    .disableImageDownloading()
    .build()

val adCallback: NativeAdLoaderCallback =
  object : NativeAdLoaderCallback {
    override fun onNativeAdLoaded(nativeAd: NativeAd) {
      // Get the image uri.
      val imageUri = nativeAd.image?.uri
    }
  };

// Load the native ad with the ad request and callback.
NativeAdLoader.load(adRequest, adLoaderCallback);

Java

NativeAdRequest adRequest = new NativeAdRequest.Builder(
  "ca-app-pub-3940256099942544/2247696110",
  List.of(NativeAd.NativeAdType.NATIVE))
  .disableImageDownloading()
  .build();

NativeAdLoaderCallback adLoaderCallback =
  new NativeAdLoaderCallback() {
    @Override
    public void onNativeAdLoaded(@NonNull NativeAd nativeAd) {
      // Get the image uri.
      Uri imageUri = nativeAd.getImage().getUri();
    }
  };

// Load the native ad with the ad request and callback.
NativeAdLoader.load(adRequest, adLoaderCallback);

Controles de carga útil de imágenes

Algunos anuncios incluyen varias imágenes en lugar de una sola. Usa esta función para indicar si tu app está preparada para mostrar todas las imágenes o solo una.

  • Los controles de carga útil de imágenes están inhabilitados de forma predeterminada.

  • Cuando se inhabilita, tu app le indica al SDK que proporcione solo la primera imagen de los recursos que contengan más de una.

  • Cuando se habilita, tu app indica que está preparada para mostrar todas las imágenes de los recursos que tienen más de una.

En el siguiente ejemplo, se indica al SDK que devuelva varios recursos de imagen.

Posiciones de AdChoices

En esta sección, se detalla cómo posicionar la superposición de AdChoices. Tienes la opción de establecer la posición en una de las cuatro esquinas o renderizarla dentro de una vista personalizada.

Controles de posición de AdChoices

Los controles de posición de AdChoices te permiten elegir en qué esquina renderizar el ícono de AdChoices.

Llama a NativeAdRequest.Builder.setAdChoicesPlacement() con un valor de NativeAdRequest.AdChoicesPlacement.

  • Si no se establece este parámetro de configuración, el ícono de AdChoices se coloca en la parte superior derecha.

  • Si se establece, el ícono de AdChoices se coloca en la posición personalizada que se solicitó.

En el siguiente ejemplo, se muestra cómo establecer una posición personalizada para la imagen de AdChoices.

Kotlin

val adRequest = NativeAdRequest.Builder(
  "ca-app-pub-3940256099942544/2247696110",
  listOf(NativeAd.NativeAdType.NATIVE))
  .setAdChoicesPlacement(NativeAdOptions.ADCHOICES_BOTTOM_RIGHT)
  .build()

Java

NativeAdRequest adRequest = new NativeAdRequest.Builder(
  "ca-app-pub-3940256099942544/2247696110",
  List.of(NativeAd.NativeAdType.NATIVE))
  .setAdChoicesPlacement(NativeAdOptions.ADCHOICES_BOTTOM_RIGHT)
  .build();

Vista personalizada de AdChoices

La función de vista personalizada de AdChoices te permite colocar el ícono de AdChoices en una ubicación personalizada. Esto es diferente de los controles de posición de AdChoices, que solo permiten especificar una de las cuatro esquinas.

Llama a NativeAdView.setAdChoicesView() con un valor de AdChoicesView.

En el siguiente ejemplo, se muestra cómo establecer una vista personalizada de AdChoices, con el ícono de AdChoices renderizado dentro de AdChoicesView.

Kotlin

override fun onNativeAdLoaded(nativeAd: NativeAd) {
  val nativeAdView = NativeAdView(applicationContext)
  val adChoicesView = AdChoicesView(this)
  nativeAdView.adChoicesView = adChoicesView
}

Java

public void onNativeAdLoaded(@NonNull NativeAd nativeAd) {
  NativeAdView nativeAdView = new NativeAdView(getApplicationContext());
  AdChoicesView adChoicesView = new AdChoicesView(this);
  nativeAdView.setAdChoicesView(adChoicesView);
}

Controles de video

En esta sección, se detalla cómo personalizar la experiencia de reproducción de los anuncios de video. Tienes la opción de establecer el estado de silencio inicial y, luego, implementar controles de reproducción personalizados.

Comportamiento de inicio en silencio

El comportamiento de inicio en silencio te permite inhabilitar o habilitar el audio de inicio de un video.

Llama a VideoOptions.Builder.setStartMuted() con un valor de boolean y llama a NativeAdOptions.Builder.setVideoOptions().

  • El comportamiento de inicio en silencio se encuentra habilitado de forma predeterminada.

  • Cuando se inhabilita, tu app solicita que el video comience con audio.

  • Cuando se habilita, tu app solicita que el video comience en silencio.

En el siguiente ejemplo, se muestra cómo iniciar el video con el audio activado.

Kotlin

val videoOptions = VideoOptions.Builder()
  .setStartMuted(false)
  .build()

val adRequest = NativeAdRequest.Builder(
  "ca-app-pub-3940256099942544/2247696110",
  listOf(NativeAd.NativeAdType.NATIVE))
  .setVideoOptions(videoOptions)
  .build()

Java

VideoOptions videoOptions = VideoOptions.Builder()
  .setStartMuted(false)
  .build()

NativeAdRequest adRequest = new NativeAdRequest.Builder(
  "ca-app-pub-3940256099942544/2247696110",
  List.of(NativeAd.NativeAdType.NATIVE))
  .setVideoOptions(videoOptions)
  .build()

Controles de reproducción personalizados

Esta función te permite solicitar controles de entrada de video personalizados para reproducir, pausar o silenciar el video.

Para establecer el estado de silencio inicial de los anuncios, llama a VideoOptions.Builder.setCustomControlsRequested().

  • Los controles de reproducción personalizados están inhabilitados de forma predeterminada.

  • Cuando se inhabilita, en el video se muestran los controles de entrada renderizados por el SDK.

Si el anuncio tiene contenido de video y los controles personalizados están habilitados, debes mostrar tus controles personalizados con el anuncio, ya que este no mostrará ningún control por sí mismo. Luego, los controles pueden llamar a los métodos pertinentes en el

VideoOptions.Builder.setCustomControlsRequested().

En el siguiente ejemplo, se muestra cómo solicitar un video con controles de reproducción personalizados.

Kotlin

val videoOptions: VideoOptions.Builder()
  .setCustomControlsRequested(true)
  .build()

val adRequest = new NativeAdRequest.Builder(
  "ca-app-pub-3940256099942544/2247696110",
  listOf(NativeAd.NativeAdType.NATIVE))
  .setVideoOptions(videoOptions)
  .build()

Java

VideoOptions VideoOptions = VideoOptions.Builder()
  .setCustomControlsRequested(true)
  .build()

NativeAdRequest adRequest = new NativeAdRequest.Builder(
  "ca-app-pub-3940256099942544/2247696110",
  List.of(NativeAd.NativeAdType.NATIVE))
  .setVideoOptions(videoOptions)
  .build()

Verifica si los controles personalizados están habilitados

Dado que, en el momento de la solicitud, no se sabe si el anuncio que se devolverá permitirá controles de video personalizados, debes verificar si estos se encuentran habilitados.

Kotlin

  val adCallback: NativeAdLoaderCallback =
    object : NativeAdLoaderCallback {
      override fun onNativeAdLoaded(nativeAd: NativeAd) {
        val mediaContent = nativeAd.mediaContent;
        if (mediaContent != null) {
          val videoController = mediaContent.videoController;
          val canShowCustomControls = videoController?.isCustomControlsEnabled();
        }
      }
    };

Java

NativeAdLoaderCallback adCallback =
  new NativeAdLoaderCallback() {
    @Override
    public void onNativeAdLoaded(@NonNull NativeAd nativeAd) {
      MediaContent mediaContent = nativeAd.getMediaContent();
      if (mediaContent != null) {
        VideoController videoController = mediaContent.getVideoController();
        if (videoController != null) {
          boolean canShowCustomControls = videoController.isCustomControlsEnabled();
        }
      }
    }
  };

Renderiza controles de video personalizados

Para renderizar los controles de video personalizados, ten en cuenta las siguientes prácticas recomendadas:

  1. Renderiza la vista de controles personalizados como secundaria con respecto a la vista de anuncio nativo. Este enfoque permite que los cálculos de visibilidad de Open Measurement consideren que los controles personalizados son una obstrucción aceptable.
  2. Evita renderizar una superposición invisible sobre toda la vista multimedia. Las superposiciones bloquean los clics en la vista multimedia, lo que perjudica el rendimiento de los anuncios nativos. En su lugar, crea una pequeña superposición que sea lo suficientemente grande como para que quepan los controles.

Gestos de clics personalizados

Los gestos de clics personalizados son una función de los anuncios nativos que permite registrar los deslizamientos en las vistas de anuncios como clics en el anuncio. Está diseñada para funcionar con apps que usan gestos de deslizamiento para navegar por el contenido. En esta guía, te mostramos cómo habilitar los gestos de clics personalizados en tus anuncios nativos.

Llama a NativeAdRequest.Builder.enableCustomClickGestureDirection() con un valor de NativeAd.SwipeGestureDirection y un valor de boolean.

En el siguiente ejemplo, se implementa un gesto de deslizamiento personalizado hacia la derecha y se conserva el comportamiento normal de las pestañas.

  • Los gestos de clics personalizados están inhabilitados de forma predeterminada.

  • Cuando se inhabilita, tu app admite el comportamiento normal de los clics.

  • Cuando se habilita, tu app admite los gestos de deslizamiento personalizados.

En el siguiente ejemplo, se implementa un gesto de deslizamiento personalizado hacia la derecha y se conserva el comportamiento normal de las pestañas.

Kotlin

val adOptions = NativeAdOptions
  .Builder()
  .enableCustomClickGestureDirection(
    /* swipeDirection */ NativeAdOptions.SWIPE_GESTURE_DIRECTION_RIGHT,
    /* tapsAllowed= */ true)
  .build();

// The following sample ad unit ID has been enabled for custom click gestures
// and can be used for testing.
val adRequest = NativeAdRequest.Builder(
  "ca-app-pub-3940256099942544/2247696110",
  listOf(NativeAd.NativeAdType.NATIVE))
  .withNativeAdOptions(adOptions)
  .build();

Java

NativeAdOptions adOptions = new NativeAdOptions
  .Builder()
  .enableCustomClickGestureDirection(
    /* swipeDirection */ NativeAdOptions.SWIPE_GESTURE_DIRECTION_RIGHT,
    /* tapsAllowed= */ true)
  .build();

// The following sample ad unit ID has been enabled for custom click gestures
// and can be used for testing.
NativeAdRequest adRequest = new NativeAdRequest.Builder(
  "ca-app-pub-3940256099942544/2247696110",
  List.of(NativeAd.NativeAdType.NATIVE))
  .withNativeAdOptions(adOptions)
  .build();

Cómo detectar eventos de gestos de deslizamiento

Para escuchar los eventos de gestos de deslizamiento, llama a NativeAd.setAdEventCallback() con un NativeAdEventCallback y, luego, implementa el método onAdSwipeGestureClicked().

Kotlin

  val adCallback: NativeAdLoaderCallback =
    object : NativeAdLoaderCallback {
      override fun onNativeAdLoaded(nativeAd: NativeAd) {
        // Implement the onAdSwipeGestureClicked() method.
        val nativeAdCallback: NativeAdEventCallback = object : NativeAdEventCallback {
          override fun onAdSwipeGestureClicked() {
            // A swipe gesture click has occurred.
          }
        }
      }
    }
  // Load the native ad with the ad request and callback.
  NativeAdLoader.load(adRequest, adCallback)

Java

  NativeAdLoaderCallback adCallback =
    new NativeAdLoaderCallback() {
      @Override
      public void onNativeAdLoaded(@NonNull NativeAd nativeAd) {
        // Implement the onAdSwipeGestureClicked() method.
        NativeAdEventCallback nativeAdCallback = new NativeAdEventCallback() {
          @Override
          public void onAdSwipeGestureClicked() {
            // A swipe gesture click has occurred.
          }
        };
      }
    };
  // Load the native ad with the ad request and callback.
  NativeAdLoader.load(adRequest, adCallback);

Mediación

Los gestos de clics personalizados solo funcionan en los anuncios nativos que renderiza el SDK de anuncios de Google para dispositivos móviles. Las fuentes de anuncios que requieren SDKs de terceros para la renderización no responden al parámetro de configuración de direcciones de clics personalizados.