Formatos personalizados de los anuncios nativos

Formatos de anuncios personalizados

Al igual que los equivalentes definidos por el sistema, los formatos de anuncios nativos personalizados se cargan usando objetos GADAdLoader. Si incluyes la constante GADAdLoaderAdTypeCustomNative en el array adTypes cuando inicializas un GADAdLoader, se configurará para solicitar formatos nativos personalizados cuando se carguen anuncios.

GADCustomNativeAdLoaderDelegate

El protocolo para cargar formatos personalizados tiene dos métodos. GADAdLoader usa el primero para averiguar qué IDs de formato debe solicitar:

Swift

public func customNativeAdFormatIDs(for adLoader: GADAdLoader) -> [Any]

Objective‑C

- (NSArray *)customNativeAdFormatIDsForAdLoader:(GADAdLoader *)adLoader;

Cada formato de anuncio nativo personalizado tiene un ID de formato correspondiente que lo identifica. Cuando se llama a este método, tu app debe mostrar un array con los IDs de formato de los anuncios que está preparada para mostrar.

El segundo mensaje se envía cuando se carga el anuncio nativo personalizado, similar a los formatos definidos por el sistema:

Swift

public func adLoader(_ adLoader: GADAdLoader,
    didReceive customNativeAd: GADCustomNativeAd)

Objective‑C

- (void)adLoader:(GADAdLoader *)adLoader
    didReceiveCustomNativeAd:(GADCustomNativeAd *)customNativeAd;

IDs de formato

Los IDs de formato que se usan para hacer referencia de forma exclusiva a formatos de anuncios nativos personalizados se pueden encontrar en la IU de Ad Manager , en la sección Nativo del menú desplegable Publicación:

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

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

Cómo mostrar formatos de anuncios nativos personalizados

Los formatos de anuncios nativos personalizados difieren de los definidos por el sistema en que los editores pueden definir su propia lista de elementos que conforman un anuncio. Debido a esto, el proceso para mostrar anuncios nativos personalizados difiere del que se utiliza para formatos definidos por el sistema de algunas maneras:

  1. Debido a que GADCustomNativeAd está diseñado para controlar cualquiera de los formatos de anuncios nativos personalizados que crees, no tiene descriptores de acceso de recursos con nombre. En cambio, ofrece métodos como imageForKey: y stringForKey:, que toman el nombre del campo como argumento.
  2. No hay una clase de vista de anuncios dedicada como GADNativeAdView para usar con GADCustomNativeAd. Puedes usar la vista que tenga sentido para la experiencia del usuario.
  3. Debido a que no hay una clase exclusiva de reproducción de anuncios, no es necesario registrar ninguna de las vistas que usas para mostrar los elementos del anuncio.

A continuación, se incluye un ejemplo de una vista de un anuncio capaz de mostrar un anuncio nativo personalizado simple:

MySimpleNativeAdView.h

Swift

import UIKit
import GoogleMobileAds

/// Custom native ad view class with format ID 10063170.
class MySimpleNativeAdView: UIView {

  /// Weak references to this ad's asset views.
  @IBOutlet weak var headlineView: UILabel!
  @IBOutlet weak var mainImageView: UIImageView!
  @IBOutlet weak var captionView: UILabel!

  ...

  /// Populates the ad view with the custom native ad object.
  func populateWithCustomNativeAd(_ customNativeAd: GADCustomNativeAd) {
    ...
  }
}

Objective‑C

@import UIKit;
@import GoogleMobileAds;

/// View representing a custom native ad format with format ID 10063170.
@interface MySimpleNativeAdView : UIView

// Weak references to this ad's asset views.
@property(weak, nonatomic) IBOutlet UILabel *headlineView;
@property(weak, nonatomic) IBOutlet UIImageView *mainImageView;
@property(weak, nonatomic) IBOutlet UILabel *captionView;

/// Populates the ad view with the custom native ad object.
- (void)populateWithCustomNativeAd:(GADCustomNativeAd *)customNativeAd;

@end

MySimpleNearlineView.m (extracto)

Swift

...
func populateWithCustomNativeAd(_ customNativeAd: GADCustomNativeAd) {
  self.customNativeAd = customNativeAd

  // Populate the custom native ad assets.
  headlineView.text = self.customNativeAd.stringForKey("Headline")
  mainImageView.image = self.customNativeAd.imageForKey("MainImage")?.image
  captionView.text = self.customNativeAd.stringForKey("Caption")
}
...

Objective‑C

...
- (void)populateWithCustomNativeAd:(GADCustomNativeAd *)customNativeAd {
  self.customNativeAd = customNativeAd;

  // Populate the custom native ad assets.
  self.headlineView.text = [customNativeAd stringForKey:@"Headline"];
  self.mainImageView.image = [customNativeAd imageForKey:@"MainImage"].image;
  self.captionView.text = [customNativeAd stringForKey:@"Caption"];
}
...

Video nativo para formatos de anuncios nativos personalizados

Cuando creas un formato personalizado, tienes la opción de hacer que el formato sea apto para video.

En la implementación de tu app, puedes usar la propiedad GADCustomNativeAd.mediaView para obtener la vista del video. Luego, agrega esta vista a tu jerarquía de vistas. Si el anuncio no tiene contenido de video, cree planes alternativos para mostrarlo sin el video.

El siguiente ejemplo verifica si el anuncio tiene contenido de video y muestra una imagen en su lugar si un video no está disponible:

Swift

...
  /// Populates the ad view with the custom native ad object.
  func populate(withCustomNativeAd customNativeAd: GADCustomNativeAd) {
    if customNativeAd.videoController.hasVideoContent(),
      let mediaView = customNativeAd.mediaView {
      updateMainView(mediaView)
    } else {
      // Assumes your native format has an image asset with the name MainImage.
      let image: UIImage? = customNativeAd.image(forKey: "MainImage")?.image
      updateMainView(UIImageView(image: image))
    }
  }

  private func updateMainView(_ mainView:UIView) {
    // Assumes you have a placeholder view for your media content.
    // Remove all the placeholder's subviews.
    for subview: UIView in mainPlaceholder.subviews {
      subview.removeFromSuperview()
    }
    mainPlaceholder.addSubview(mainView)
    // Size the media view to fill our container size.
    mainView.translatesAutoresizingMaskIntoConstraints = false
    let viewDictionary: [AnyHashable: Any] = ["mainView":mainView]
    mainPlaceholder.addConstraints(NSLayoutConstraint.constraints(
      withVisualFormat: "H:|[mainView]|", options: [], metrics: nil,
      views: viewDictionary as? [String : Any] ?? [String : Any]()))
    mainPlaceholder.addConstraints(NSLayoutConstraint.constraints(
      withVisualFormat: "V:|[mainView]|", options: [], metrics: nil,
      views: viewDictionary as? [String : Any] ?? [String : Any]()))
  }
...

Objective‑C

...
- (void)populateWithCustomNativeAd:(GADCustomNativeAd *)ad {
  UIView *mainView = nil;
  if (ad.videoController.hasVideoContent) {
    mainView = ad.mediaView;
  } else {
    // Assumes your native format has an image asset with the name MainImage.
    UIImage *image = [ad imageForKey:@"MainImage"].image;
    mainView = [[UIImageView alloc] initWithImage:image];
  }
  // Assumes you have a placeholder view for your media content.
  for (UIView *subview in self.mainPlaceholder.subviews) {
    [subview removeFromSuperview];
  }
  [self.mainPlaceholder addSubview:mainView];

  // Size the main view to fill our container size.
  [mainView setTranslatesAutoresizingMaskIntoConstraints:NO];
  NSDictionary *viewDictionary = NSDictionaryOfVariableBindings(mainView);
  [self.mainPlaceholder
      addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|[mainView]|"
                                                             options:0
                                                             metrics:nil
                                                               views:viewDictionary]];
  [self.mainPlaceholder
      addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|[mainView]|"
                                                             options:0
                                                             metrics:nil
                                                               views:viewDictionary]];
}
...

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

Descarga el ejemplo de renderización personalizada de Ad Manager para ver un ejemplo funcional de un video nativo en acción.

Cómo administrar las impresiones y los clics de anuncios nativos personalizados

Para los formatos de anuncios nativos personalizados, tu app es responsable de registrar impresiones y de informar eventos de clic al SDK.

Registra impresiones

Para registrar una impresión para un anuncio nativo personalizado, simplemente llama al método recordImpression en el GADCustomNativeAd correspondiente:

Swift

myCustomNativeAd.recordImpression()

Objective‑C

[myCustomNativeAd recordImpression];

El SDK evita que se registren impresiones duplicadas para una sola solicitud en caso de que tu app llame accidentalmente al método varias veces para el mismo anuncio.

Informes de clics

Para informar al SDK que se produjo un clic en la vista de elementos, llama al método performClickOnAssetWithKey: en el objeto GADCustomNativeAd correspondiente y pasa el nombre del recurso en el que se hizo clic. Por ejemplo, si tienes un recurso en tu formato personalizado llamado "MainImage" y deseas informar un clic en la vista que corresponde a ese recurso, tu código se vería de la siguiente manera:

Swift

myCustomNativeAd.performClickOnAsset(withKey: "MainImage")

Objective‑C

[myCustomNativeAd performClickOnAssetWithKey:@"MainImage"];

Ten en cuenta que no es necesario llamar a este método para cada vista de elementos asociada con tu anuncio. Si tenías otro recurso llamado "Caption", por ejemplo, que estaba destinado a mostrarse, pero que el usuario no hizo clic en él ni lo presionó, tu app no necesitaría llamar a performClickOnAssetWithKey: para esa vista.

Cómo responder a acciones de clic personalizadas

GADCustomNativeAd tiene una propiedad customClickHandler que es del tipo GADNativeAdCustomClickHandler.

Swift

typealias GADNativeAdCustomClickHandler = (assetID: String) -> Void

Objective‑C

typedef void (^GADNativeAdCustomClickHandler)(NSString *assetID);

Este es un bloque (Objective-C) / cierre (Swift) que acepta un assetID como parámetro de entrada, lo que identifica el recurso en el que se hizo clic.

Cuando se realiza un clic en un anuncio nativo personalizado, hay tres respuestas posibles del SDK que se intentan en este orden:

  1. Invoca el bloque customClickHandler en Objective-C o el cierre en Swift, si se configuró.
  2. Recorre las URLs de vínculo directo del anuncio y abre la primera para la que se puede encontrar una app coincidente.
  3. Abra un navegador y vaya a la URL de destino tradicional del anuncio.

La propiedad customClickHandler acepta un bloqueo en Objective-C y un cierre en Swift. Si estableces un bloqueo o un cierre, el SDK los ejecutará y no realizará ninguna otra acción. Sin embargo, si estableces un valor nulo, el SDK recurrirá a las URLs de vínculo directo o de destino registradas con el anuncio.

Los controladores de clics personalizados permiten que tu app decida por sí misma la mejor acción para realizar un clic, ya sea actualizar la IU, presentar otro controlador de vista o simplemente registrar el clic. Este es un ejemplo que muestra una alerta:

Swift

myCustomNativeAd.customClickHandler = { assetID in
  if assetID == "MainImage" {
    let alertView = UIAlertView(title: "Custom Click",
        message: "You just clicked on the image!",
        delegate: self,
        cancelButtonTitle: "OK")
    alertView.alertViewStyle = .default
    alertView.show()
  }
}
myCustomNativeAd.performClickOnAsset(withKey: "MainImage")

Objective‑C

[self.customNativeAd setCustomClickHandler:^(NSString *assetID){
  if ([assetID isEqualToString:@"MainImage"]) {
    [[[UIAlertView alloc] initWithTitle:@"Custom Click"
                                message:@"You just clicked on the image!"
                               delegate:self
                      cancelButtonTitle:@"OK"
                      otherButtonTitles:nil] show];
  }
}];
[self.customNativeAd performClickOnAssetWithKey:@"MainImage"];

Cómo probar el código de anuncio nativo

Anuncios de venta directa

Si quieres probar cómo son los anuncios nativos de venta directa, puedes usar este Ad Manager ID de unidad de anuncios:

/6499/example/native

Está configurada para publicar anuncios de contenido y de instalación de apps de muestra, así como un formato de anuncio nativo personalizado con los siguientes elementos:

  • Título (texto)
  • MainImage (imagen)
  • Leyenda (texto)

Anuncios nativos de reabastecimiento

Para probar el comportamiento de los anuncios de reabastecimiento nativos, usa esta unidad de anunciosAd Manager :

/6499/example/native-backfill

Publicará anuncios de instalación de app y de contenido de ejemplo que incluyan la superposición de AdChoices.

Recuerda actualizar el código para hacer referencia a los IDs de formato y de la unidad de anuncios reales antes de lanzar la app.