Formatos de anuncios nativos personalizados

Además de los formatos nativos definidos por el sistema, los publicadores de Ad Manager tienen la opción de crear sus propios formatos de anuncios nativos definiendo listas personalizadas de recursos. Estos se denominan formatos de anuncios nativos personalizados y se pueden usar con anuncios reservados. De este modo, los publicadores pueden pasar datos estructurados arbitrarios a sus apps. Estos anuncios se representan con el objeto NativeCustomFormatAd.

Nota: La clase NativeCustomFormatAd no admite la recepción del objeto ResponseInfo ni del paquete extras.

Carga formatos de anuncios nativos personalizados

En esta guía, se explica cómo cargar y mostrar formatos de anuncios nativos personalizados.

Carga un anuncio nativo personalizado

Para cargar un anuncio nativo personalizado, haz lo siguiente:

1. Incluye el tipo NativeAdType.CUSTOM_NATIVE como un tipo de anuncio en NativeAdRequest.

2. Establece el ID del formato del anuncio nativo personalizado.

Kotlin

val adRequest =
  NativeAdRequest.Builder("AD_UNIT_ID", listOf(NativeAdType.CUSTOM_NATIVE))
    .setCustomFormatIds(listOf("CUSTOM_NATIVE_FORMAT_ID"))
    .build()

// Load the native ad with the ad request and callback.
NativeAdLoader.load(
  adRequest,
  object : NativeAdLoaderCallback {
    override fun onCustomNativeAdLoaded(customNativeAd: CustomNativeAd) {
      // TODO: Store the custom native ad.
    }

    override fun onAdFailedToLoad(adError: LoadAdError) {}
  },
)

Java

NativeAdRequest adRequest =
    new NativeAdRequest.Builder("AD_UNIT_ID", List.of(NativeAd.NativeAdType.CUSTOM_NATIVE))
        .setCustomFormatIds(Arrays.asList("CUSTOM_NATIVE_FORMAT_ID"))
        .build();

// Load the native ad with the ad request and callback.
NativeAdLoader.load(
    adRequest,
    new NativeAdLoaderCallback() {
      @Override
      public void onCustomNativeAdLoaded(@NonNull CustomNativeAd customNativeAd) {
        // TODO: Store the custom native ad.
      }

      @Override
      public void onAdFailedToLoad(@NonNull LoadAdError adError) {}
    });

ID del formato de anuncio nativo personalizado

El ID del formato que se usa para identificar un formato de anuncio nativo personalizado se puede encontrar en la IU de Ad Manager, en la sección Nativo del menú desplegable Publicación:

El ID de cada formato de anuncio nativo personalizado aparece junto a su nombre. Si haces clic en uno de los nombres, se abrirá una pantalla de detalles con información sobre los campos del formato:

Desde aquí, se pueden agregar, editar y quitar campos individuales. Observa el Nombre de cada uno de los recursos. El nombre es la clave que se usa para obtener los datos de cada recurso cuando se muestra tu formato de anuncio nativo personalizado.

Muestra formatos personalizados de anuncios nativos

Los formatos de anuncios nativos personalizados se diferencian de los definidos por el sistema en que les ofrecen a los publicadores la capacidad de definir su propia lista de recursos que componen un anuncio. Por lo tanto, el proceso para mostrar uno difiere de los formatos definidos por el sistema en varios aspectos:

1. Los recursos de imagen y texto están disponibles a través de los métodos get getText() y getImage() que toman el nombre del campo como parámetro.
2. Como no hay una clase ViewGroup exclusiva para registrarse en Google, debes asentar las impresiones y los clics de forma manual.
3. Un anuncio nativo personalizado tiene contenido multimedia null si no contiene un recurso de video.

En este ejemplo, se muestra cómo mostrar un CustomNativeAd:

Kotlin

private fun displayCustomNativeAd(customNativeAd: CustomNativeAd, context: Context) {
  // Render the text elements.

  // The `customNativeAdBinding` is the layout binding for the ad container that
  // contains all `CustomNativeAd` assets.
  customNativeAdBinding.headline.text = customNativeAd.getText("Headline")
  customNativeAdBinding.caption.text = customNativeAd.getText("Caption")

  // If the main asset is an image, render it with an ImageView.
  val imageView = ImageView(context)
  imageView.adjustViewBounds = true
  imageView.setImageDrawable(customNativeAd.getImage("MainImage")?.drawable)
  imageView.setOnClickListener { customNativeAd.performClick("MainImage") }
  customNativeAdBinding.mediaPlaceholder.addView(imageView)

  // Render the ad choices icon.
  renderAdChoices(customNativeAd)

  // Record an impression.
  customNativeAd.recordImpression()
}

Java

private void displayCustomNativeAd(CustomNativeAd customNativeAd, Context context) {
  // Render the text elements.

  // The `customNativeAdBinding` is the layout binding for the ad container that
  // contains all `CustomNativeAd` assets.
  if (customNativeAdBinding != null) {
    customNativeAdBinding.headline.setText(customNativeAd.getText("Headline"));
    customNativeAdBinding.caption.setText(customNativeAd.getText("Caption"));

    ImageView imageView = new ImageView(context);
    imageView.setAdjustViewBounds(true);
    imageView.setImageDrawable(customNativeAd.getImage("MainImage").getDrawable());
    imageView.setOnClickListener(
        new View.OnClickListener() {
          @Override
          public void onClick(View v) {
            customNativeAd.performClick("MainImage");
          }
        });
    customNativeAdBinding.mediaPlaceholder.addView(imageView);

    // Render the ad choices icon.
    renderAdChoices(customNativeAd);

    // Record an impression.
    customNativeAd.recordImpression();
  }
}

Video nativo para formatos de anuncios nativos personalizados

Cuando crees un formato personalizado, tendrás la opción de hacerlo apto para video.

En la implementación de tu app, puedes usar CustomNativeAd.getMediaContent() para obtener el contenido multimedia. Luego, llama a setMediaContent() para establecer el contenido multimedia en tu vista de medios. Si el anuncio tiene contenido multimedia null, sigue el procedimiento que corresponda para mostrarlo sin video.

En el siguiente ejemplo, se verifica si el anuncio tiene contenido de video y se muestra una imagen en su lugar si no hay un video disponible:

Kotlin

private fun displayVideoCustomNativeAd(customNativeAd: CustomNativeAd, context: Context) {
  // Check whether the custom native ad has video content.
  val mediaContent = customNativeAd.mediaContent
  if (mediaContent != null && mediaContent.hasVideoContent) {
    // Render the media content in a MediaView.
    val mediaView = MediaView(context)
    mediaView.mediaContent = mediaContent
    customNativeAdBinding.mediaPlaceholder.addView(mediaView)
  } else {
    // Fall back to other assets defined on your custom native ad.
    val imageView = ImageView(context)
    imageView.adjustViewBounds = true
    imageView.setImageDrawable(customNativeAd.getImage("MainImage")?.drawable)
    customNativeAdBinding.mediaPlaceholder.addView(imageView)
  }

  // Record an impression.
  customNativeAd.recordImpression()
}

Java

private void displayVideoCustomNativeAd(CustomNativeAd customNativeAd, Context context) {
  // Check whether the custom native ad has video content.
  MediaContent mediaContent = customNativeAd.getMediaContent();
  if (mediaContent != null && mediaContent.getHasVideoContent()) {
    // Render the media content in a MediaView.
    MediaView mediaView = new MediaView(context);
    mediaView.setMediaContent(mediaContent);
    customNativeAdBinding.mediaPlaceholder.addView(mediaView);
  } else {
    // Fall back to other assets defined on your custom native ad.
    ImageView imageView = new ImageView(context);
    imageView.setAdjustViewBounds(true);
    imageView.setImageDrawable(customNativeAd.getImage("MainImage").getDrawable());
    customNativeAdBinding.mediaPlaceholder.addView(imageView);
  }

  // Record an impression.
  customNativeAd.recordImpression();
}

Consulta Anuncios de video para obtener más información sobre cómo puedes personalizar la experiencia de video de un anuncio nativo personalizado.

Renderiza el ícono de AdChoices

Como parte del Apoyo a la Ley de Servicios Digitales (DSA), los anuncios de reservación que se publican en el Espacio Económico Europeo (EEE) requieren un ícono de AdChoices y un vínculo a la página Acerca del anuncio de Google. Cuando implementas anuncios nativos personalizados, eres responsable de renderizar el ícono de AdChoices. Te recomendamos que sigas los pasos para renderizar y configurar el objeto de escucha de clics para el ícono de AdChoices cuando renderices los recursos principales del anuncio.

En el siguiente ejemplo, se supone que definiste un elemento <ImageView /> en la jerarquía de vistas para incluir el logotipo de AdChoices.

Importante: Configura el ícono de AdChoices en al menos 15 píxeles por 15 píxeles.

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android">
    <ImageView
        android:id="@+id/adChoices"
        android:layout_width="15dp"
        android:layout_height="15dp"
        android:adjustViewBounds="true"
        android:contentDescription="AdChoices icon." />
</LinearLayout>

En el siguiente ejemplo, se renderiza el ícono de AdChoices y se configura el comportamiento de clics adecuado.

Kotlin

private fun renderAdChoices(customNativeAd: CustomNativeAd) {
  // Render the AdChoices image.
  val adChoiceAsset = customNativeAd.getImage(NativeAdAssetNames.ASSET_ADCHOICES_CONTAINER_VIEW)
  if (adChoiceAsset != null) {
    customNativeAdBinding.adchoices.setImageDrawable(adChoiceAsset.drawable)
    customNativeAdBinding.adchoices.visibility = View.VISIBLE
    customNativeAdBinding.adchoices.setOnClickListener {
      // Handle click. See the next section for more details.
      customNativeAd.performClick(NativeAdAssetNames.ASSET_ADCHOICES_CONTAINER_VIEW)
    }
  } else {
    customNativeAdBinding.adchoices.visibility = View.GONE
  }
}

Java

private void renderAdChoices(CustomNativeAd customNativeAd) {
  // Render the AdChoices image.
  Image adChoiceAsset =
      customNativeAd.getImage(NativeAdAssetNames.ASSET_ADCHOICES_CONTAINER_VIEW);
  if (adChoiceAsset != null) {
    if (customNativeAdBinding != null) {
      customNativeAdBinding.adchoices.setImageDrawable(adChoiceAsset.getDrawable());
      customNativeAdBinding.adchoices.setVisibility(View.VISIBLE);
      customNativeAdBinding.adchoices.setOnClickListener(
          new View.OnClickListener() {
            @Override
            public void onClick(View v) {
              // Handle click.
              customNativeAd.performClick(NativeAdAssetNames.ASSET_ADCHOICES_CONTAINER_VIEW);
            }
          });
    }
  } else {
    if (customNativeAdBinding != null) {
      customNativeAdBinding.adchoices.setVisibility(View.GONE);
    }
  }
}

Punto clave: Si usas el control de descarga de imágenes para solicitar solo URLs de imágenes, el recurso de AdChoices respeta este parámetro de configuración y solo devuelve la URL de imagen.

Registra impresiones e informa los clics

Tu app es responsable de registrar las impresiones y de informar los eventos de clic al SDK de anuncios de Google para dispositivos móviles (beta).

Registra impresiones

Para registrar una impresión de un anuncio nativo personalizado, llama al método recordImpression() del anuncio:

Kotlin

// Record an impression.
customNativeAd.recordImpression()

Java

// Record an impression.
customNativeAd.recordImpression();

Si tu app llama accidentalmente al método dos veces para el mismo anuncio, el SDK evita automáticamente que se registre una impresión duplicada para una sola solicitud.

Informa los clics

Para informar al SDK que se hizo clic en una vista de recurso, llama al método performClick() del anuncio. Proporciona el nombre del recurso en el que se hizo clic con la misma cadena que definiste en la IU de Ad Manager.

Kotlin

imageView.setOnClickListener { customNativeAd.performClick("MainImage") }

Java

imageView.setOnClickListener(
    new View.OnClickListener() {
      @Override
      public void onClick(View v) {
        customNativeAd.performClick("MainImage");
      }
    });

Ten en cuenta que no es necesario que llames a este método para cada vista asociada a tu anuncio. Por ejemplo, si tuvieras otro campo llamado "Caption" que se debería mostrar, pero sin que el usuario haga clic en él ni lo presione, tu app no necesitaría llamar a performClick para la vista de ese recurso.

Responde a acciones de clic personalizadas

Cuando se hace clic en un anuncio de formato personalizado, el SDK puede responder de tres maneras posibles, que se intentan en este orden:

1. Se invoca el objeto OnCustomClickListener, si se proporcionó.
2. Para cada una de las URLs de vínculo directo del anuncio, se intenta localizar un resolver de contenido y, luego, se inicia el primero que se resuelva.
3. Se abre un navegador y se dirige a la URL de destino del anuncio.

Si quieres implementar una acción de clic personalizada, proporciona un OnCustomClickListener:

Kotlin

customNativeAd.onCustomClickListener =
  object : OnCustomClickListener {
    override fun onCustomClick(assetName: String) {
      // Perform your custom action.
    }
  }

Java

customNativeAd.setOnCustomClickListener(
    new OnCustomClickListener() {
      @Override
      public void onCustomClick(@NonNull String assetName) {
        // Perform your custom action.
      }
    });

Al principio, podría parecer extraño que existan objetos de escucha de clics personalizados. Después de todo, tu app le acaba de indicar al SDK que se produjo un clic, entonces, ¿por qué el SDK debería informar eso a la app?

Este flujo de información es útil por varios motivos, pero lo más importante es que permite que el SDK mantenga el control de la respuesta al clic. Por ejemplo, puede hacer ping automáticamente a las URLs de seguimiento de terceros que se configuraron para la creatividad y controlar otras tareas en segundo plano sin ningún código adicional.