Native Ads – Custom Rendering

No momento, esse recurso é oferecido como uma versão Beta limitada. Se você tiver interesse em testá-la, converse sobre essa possibilidade com seu gerente da conta. Esse recurso será disponibilizado a todos os editores após a conclusão da versão Beta.

Este guia explica como usar o SDK de anúncios para dispositivos móveis do Google com a finalidade de implementar anúncios nativos do DFP em um aplicativo iOS, além de outros aspectos importantes a serem considerados durante esse processo.

Pré-requisitos

Este guia parte da premissa de que você tem um conhecimento razoável sobre o funcionamento do SDK de anúncios para dispositivos móveis do Google. Se não for o caso, considere a possibilidade de consultar nosso Guia de primeiros passos.

O que é um anúncio nativo?

Os anúncios nativos são um tipo de publicidade exibida aos usuários por meio de componentes da IU que são nativos à plataforma. Eles são exibidos com base nas mesmas classes usadas nos seus storyboards e podem ser formatados de modo compatível com o design visual do seu aplicativo. Quando um anúncio nativo é carregado, seu aplicativo recebe um objeto de anúncio nativo que contém os recursos dele. Dessa forma, o aplicativo (não o SDK) é responsável por exibir esses recursos.

Formatos de anúncios nativos definidos pelo sistema

Existem dois formatos de anúncios nativos definidos pelo sistema: instalação do app e conteúdo. Os anúncios de instalação do app são representados por GADNativeAppInstallAd, enquanto os anúncios de conteúdo, por GADNativeContentAd. As instâncias das classes contêm os recursos do anúncio nativo.

Formatos de anúncios nativos personalizados

Além dos formatos nativos definidos pelo sistema, os editores do DFP têm a opção de criar seus próprios formatos de anúncios personalizados por meio da definição de listas de recursos padronizadas. Eles são conhecidos como formatos de anúncios nativos personalizados e podem ser usados como anúncios nativos de venda direta. Com os formatos de anúncios nativos personalizados, os editores podem passar dados estruturados arbitrários para os aplicativos deles. Esses anúncios são representados pela classe GADNativeCustomTemplateAd.

Os formatos de anúncios nativos personalizados também são conhecidos como anúncios de modelos personalizados. Isso ocorre porque os editores definem seus próprios "modelos" (listas de nomes e tipos de recurso) para os formatos de anúncios nativos personalizados. Isso ficará mais claro à medida que você avançar neste guia. Por enquanto, basta lembrar que "anúncios de modelos personalizados" e "formatos de anúncios nativos personalizados" são dois termos que se referem ao mesmo tipo de anúncio.

Como carregar formatos de anúncios nativos definidos pelo sistema

Os anúncios nativos são carregados por meio de objetos GADAdLoader, que enviam mensagens aos delegados deles de acordo com o protocolo GADAdLoaderDelegate.

Como inicializar um GADAdLoader

O código a seguir mostra como inicializar um GADAdLoader para um anúncio de instalação do app:

Objective-C

self.adLoader = [[GADAdLoader alloc]
      initWithAdUnitID:@"/6499/example/native"
    rootViewController:rootViewController
               adTypes:@[ ... ad type constants ... ]
               options:@[ ... ad loader options objects ... ]];
self.adLoader.delegate = self;

Swift

adLoader = GADAdLoader(adUnitID: "/6499/example/native",
    rootViewController: self,
    adTypes: [ ... ad type constants ... ],
    options: [ ... ad loader options objects ... ])
adLoader.delegate = self

O parâmetro de sequência adTypes permite que seu aplicativo passe constantes que especificam quais anúncios nativos ele deseja solicitar. A sequência deve conter pelo menos uma das seguintes constantes:

  • kGADAdLoaderAdTypeNativeAppInstall
  • kGADAdLoaderAdTypeNativeContent
  • kGADAdLoaderAdTypeNativeCustomTemplate

Como solicitar o anúncio nativo

Quando seu GADAdLoader for inicializado, chame o método loadRequest: dele para solicitar um anúncio:

Objective-C

[self.adLoader loadRequest:[DFPRequest request]];

Swift

adLoader.loadRequest(DFPRequest())

O método loadRequest do GADAdLoader aceita os mesmos objetos DFPRequest dos banners e intersticiais. É possível usar os objetos da solicitação para adicionar informações de segmentação do mesmo modo que você faria com outros tipos de anúncios.

Um único GADAdLoader pode fazer várias solicitações, contanto que elas sejam feitas uma de cada vez. Ao reutilizar um GADAdLoader, aguarde a finalização de cada solicitação antes de chamar o loadRequest novamente para iniciar a próxima. Se você precisar solicitar vários anúncios em paralelo, poderá usar vários objetos GADAdLoader.

Protocolos do GADAdLoaderDelegate

Para cada formato de anúncio nativo solicitado, o delegado do carregador de anúncios precisa implementar um protocolo correspondente:

GADNativeAppInstallAdLoaderDelegate

Esse protocolo inclui a mensagem que é enviada para o delegado quando um anúncio de instalação de app é carregado:

Objective-C

- (void)adLoader:(GADAdLoader *)adLoader
    didReceiveNativeAppInstallAd:(GADNativeAppInstallAd *)nativeAppInstallAd;

Swift

public func adLoader(adLoader: GADAdLoader!,
    didReceiveNativeAppInstallAd nativeAppInstallAd: GADNativeAppInstallAd!)

GADNativeContentAdLoaderDelegate

Este protocolo define a mensagem enviada quando um anúncio de conteúdo é carregado:

Objective-C

- (void)adLoader:(GADAdLoader *)adLoader
    didReceiveNativeContentAd:(GADNativeContentAd *)nativeContentAd;

Swift

public func adLoader(adLoader: GADAdLoader!,
    didReceiveNativeContentAd nativeContentAd: GADNativeContentAd!)

Como tratar uma solicitação com falha

Os protocolos acima estendem o protocolo GADAdLoaderDelegate, que define a mensagem enviada quando ocorre uma falha no carregamento dos anúncios:

Objective-C

- (void)adLoader:(GADAdLoader *)adLoader
    didFailToReceiveAdWithError:(GADRequestError *)error;

Swift

public func adLoader(adLoader: GADAdLoader!,
    didFailToReceiveAdWithError error: GADRequestError!)

É possível usar o objeto GADRequestError para determinar a causa do erro.

Opções de anúncios nativos

O último parâmetro incluído na criação do GADAdLoader acima é uma sequência opcional de objetos:

Objective-C

self.adLoader = [[GADAdLoader alloc]
      initWithAdUnitID:@"/6499/example/native"
    rootViewController:rootViewController
               adTypes:@[ ... ad type constants ... ]
               options:@[ ... ad loader options objects ... ]];

Swift

adLoader = GADAdLoader(adUnitID: "/6499/example/native",
    rootViewController: self,
    adTypes: [ ... ad type constants ... ],
    options: [ ... ad loader options objects ... ])

O parâmetro GADNativeAdImageAdLoaderOptions contém propriedades relacionadas com as imagens dos anúncios nativos. Para controlar como um GADAdLoader trata os recursos de imagens dos anúncios nativos, os aplicativos criam um objeto GADNativeAdImageAdLoaderOptions, definem as propriedades dele e passam esse objeto durante a inicialização.

O GADNativeAdImageAdLoaderOptions tem as seguintes propriedades:

disableImageLoading: os recursos de imagens dos anúncios nativos são retornados por meio de instâncias do GADNativeAdImage, que contém as propriedades image e imageURL. Se o disableImageLoading estiver definido como false (que é a configuração padrão), o SDK buscará recursos de imagem automaticamente e preencherá as propriedades image e imageURL para você. No entanto, se essa opção estiver definida como "true", o SDK preencherá somente o campo imageURL, permitindo que você faça o download das imagens reais de acordo com as suas necessidades.

preferredImageOrientation: alguns criativos têm várias imagens disponíveis que correspondem a diferentes orientações do dispositivo. É possível fazer com que os aplicativos solicitem uma orientação específica por meio da configuração dessa propriedade como uma das seguintes constantes:

  • GADNativeAdImageAdLoaderOptionsOrientationAny
  • GADNativeAdImageAdLoaderOptionsOrientationLandscape
  • GADNativeAdImageAdLoaderOptionsOrientationPortrait

Se esse método não for chamado, o valor padrão de GADNativeAdImageAdLoaderOptionsOrientationAny será usado.

shouldRequestMultipleImages: alguns recursos de imagens contêm uma série de imagens em vez de apenas uma. Quando esse valor é definido como "true", seu aplicativo indica que está preparado para exibir todas as imagens dos recursos que têm mais de uma imagem. Quando esse valor é definido como "false" (configuração padrão), seu aplicativo instrui o SDK a fornecer somente a primeira imagem dos recursos que contêm uma série de imagens.

Se nenhum objeto GADAdLoaderOptions for passado durante a inicialização de um GADAdLoader, o valor padrão de cada opção será usado.

GADNativeAdViewOptions

O parâmetro GADNativeAdViewAdOptions contém a propriedade preferredAdChoicesPosition, que pode ser usada pelos editores para especificar o local onde o ícone das Opções de anúncios deve ser colocado. O ícone pode ser exibido em qualquer canto do anúncio e tem o valor padrão de GADAdChoicesPositionTopRightCorner.

Veja um exemplo que mostra como colocar o ícone das Opções de anúncios no canto superior esquerdo de um anúncio:

Objective-C

GADNativeAdViewAdOptions *adViewOptions = [[GADNativeAdViewAdOptions alloc] init];
adViewOptions.preferredAdChoicesPosition = GADAdChoicesPositionTopLeftCorner;
self.adLoader = [[GADAdLoader alloc]
      initWithAdUnitID:@"/6499/example/native"
    rootViewController:self
               adTypes:@[ kGADAdLoaderAdTypeNativeAppInstall, kGADAdLoaderAdTypeNativeContent ]
               options:@[ adViewOptions ]];

Swift

let adViewOptions = GADNativeAdViewAdOptions()
adViewOptions.preferredAdChoicesPosition = .TopLeftCorner
adLoader = GADAdLoader(adUnitID: "/6499/example/native",
    rootViewController: self,
    adTypes: [ kGADAdLoaderAdTypeNativeAppInstall, kGADAdLoaderAdTypeNativeContent],
    options: [ adViewOptions ])

Quando solicitar anúncios

Os aplicativos que exibem anúncios nativos podem solicitá-los antes do momento em que eles serão exibidos de fato. Em muitos casos, essa é uma prática recomendada. Por exemplo, considere um aplicativo cuja lista de itens exibidos inclui anúncios nativos. Esse aplicativo pode carregar anúncios nativos da lista inteira, sabendo que alguns serão exibidos somente depois que o usuário rolar a visualização e que alguns podem nem sequer ser exibidos.

A busca prévia de anúncios é uma ótima técnica, mas é importante que os editores não mantenham anúncios antigos nas listas por muito tempo sem exibi-los. Os objetos de anúncios nativos mantidos por mais de uma hora sem exibição devem ser descartados e substituídos por novos anúncios de uma nova solicitação.

Como exibir um formato de anúncio nativo definido pelo sistema

Quando um anúncio nativo é carregado, seu aplicativo recebe um objeto de anúncio nativo por meio das mensagens de protocolo do GADAdLoaderDelegate. Dessa forma, o aplicativo é responsável por exibir o anúncio (embora ele não tenha que fazer isso imediatamente). Para facilitar a exibição de formatos de anúncios definidos pelo sistema, o SDK oferece alguns recursos úteis.

As classes de visualização do anúncio

Para cada um dos formatos definidos pelo sistema, existe uma classe de "visualização do anúncio" correspondente: GADNativeAppInstallAdView para anúncios de instalação do app e GADNativeContentAdView para anúncios de conteúdo. Essas classes de visualização do anúncio são UIViews que os editores devem usar para exibir anúncios nativos do formato correspondente. Um único GADNativeAppInstallAdView, por exemplo, pode exibir uma instância única de um GADNativeAppInstallAd. Os UIView usados para exibir os recursos desse anúncio devem ser filhos desse objeto GADNativeAppInstallAdView.

Se você exibisse um anúncio de instalação de app de uma UITableView, por exemplo, a hierarquia de visualizações de uma das células teria a seguinte aparência:

As classes de visualização do anúncio também fornecem os IBOutlets que fazem o registro da visualização usada pelos recursos individuais, além de um método para registrar o próprio objeto GADNativeAd. O registro de visualizações e do objeto do anúncio nativo desse modo permite que o SDK automaticamente realize tarefas como:

  • registro de cliques
  • registro de impressões (quando o primeiro pixel fica visível na tela)
  • exibição da sobreposição das Opções de anúncios para os criativos de preenchimento nativo

A sobreposição das Opções de anúncios

Para anúncios nativos indiretos (exibidos pelo preenchimento do DFP ou por meio do Ad Exchange ou do Google AdSense), o SDK adiciona uma sobreposição das Opções de anúncios. Deixe um espaço no canto de sua preferência da visualização do anúncio nativo para o logotipo das Opções de anúncios, que é automaticamente inserido. Além disso, verifique se a sobreposição das Opções de anúncios está posicionada no conteúdo de forma que o ícone seja visto com facilidade. Para mais informações sobre a aparência e função da sobreposição, consulte as diretrizes de implementação do preenchimento nativo.

Exemplo de código

Vamos ver como exibir anúncios nativos usando visualizações carregadas dinamicamente de arquivos xib. Essa abordagem poderá ser bastante útil quando você usar GADAdLoaders configurados para solicitar vários formatos.

Como inserir os UIViews no arquivo xib

A primeira etapa é inserir os UIViews que exibem os recursos dos anúncios nativos. Isso pode ser feito no Criador de interfaces do mesmo modo que você faria para criar qualquer outro arquivo xib. Veja que aparência teria a inserção para um anúncio de instalação do app:

E agora veja que aparência teria a inserção para um anúncio de conteúdo:

Observe o valor da classe personalizada no canto superior direito das duas imagens. Ele está definido como GADNativeAppInstallAdView e GADNativeContentAdView. Essas são as classes de visualização do anúncio usadas para exibir um GADNativeAppInstallAd e um GADNativeContentAd. Para os formatos definidos pelo sistema, você precisará usar a classe de visualização do anúncio compatível com o formato de anúncio que você gostaria de exibir no layout.

Como vincular os resultados às visualizações

Quando as visualizações estiverem prontas e você tiver atribuído a classe correta de visualização de anúncio ao layout, você precisará vincular os resultados dos recursos da visualização do anúncio ao UIViews criado. Veja como você pode vincular os resultados dos recursos da visualização do anúncio ao UIViews criado para um anúncio de instalação do app:

E agora veja como você pode vincular os resultados dos recursos da visualização do anúncio ao UIViews criado para um anúncio de conteúdo:

No painel de resultados, os resultados do GADNativeAppInstallAdView e do GADNativeContentAdView foram vinculados ao UIViews inserido no Criador de interfaces. Isso permite que o SDK conheça cada um dos recursos exibidos pelos UIView. Também é importante lembrar que esses resultados representam as visualizações que eram clicáveis no anúncio.

Como exibir o anúncio

Depois que você concluir o layout e que os resultados estiverem vinculados, a próxima etapa será adicionar ao seu aplicativo o código que exibe um anúncio depois do carregamento dele. Veja um método para exibir um anúncio de instalação do app na visualização definida acima:

Objective-C

#pragma mark GADNativeAppInstallAdLoaderDelegate implementation

- (void)adLoader:(GADAdLoader *)adLoader
    didReceiveNativeAppInstallAd:(GADNativeAppInstallAd *)nativeAppInstallAd {
  // Create and place ad in view hierarchy.
  GADNativeAppInstallAdView *appInstallAdView =
      [[[NSBundle mainBundle] loadNibNamed:@"NativeAppInstallAdView"
                                     owner:nil
                                   options:nil] firstObject];
  // TODO: Make sure to add the GADNativeAppInstallAdView to the view hierarchy.

  // Associate the app install ad view with the app install ad object. This is required to make the
  // ad clickable.
  appInstallAdView.nativeAppInstallAd = nativeAppInstallAd;

  // Populate the app install ad view with the app install ad assets.
  // Some assets are guaranteed to be present in every app install ad.
  ((UILabel *)appInstallAdView.headlineView).text = nativeAppInstallAd.headline;
  ((UIImageView *)appInstallAdView.iconView).image = nativeAppInstallAd.icon.image;
  ((UILabel *)appInstallAdView.bodyView).text = nativeAppInstallAd.body;
  ((UIImageView *)appInstallAdView.imageView).image =
      ((GADNativeAdImage *)[nativeAppInstallAd.images firstObject]).image;
  [((UIButton *)appInstallAdView.callToActionView)setTitle:nativeAppInstallAd.callToAction
                                                  forState:UIControlStateNormal];

  // Other assets are not, however, and should be checked first.
  if (nativeAppInstallAd.starRating) {
    ((UIImageView *)appInstallAdView.starRatingView).image =
        [self imageForStars:nativeAppInstallAd.starRating];
    appInstallAdView.starRatingView.hidden = NO;
  } else {
    appInstallAdView.starRatingView.hidden = YES;
  }

  if (nativeAppInstallAd.store) {
    ((UILabel *)appInstallAdView.storeView).text = nativeAppInstallAd.store;
    appInstallAdView.storeView.hidden = NO;
  } else {
    appInstallAdView.storeView.hidden = YES;
  }

  if (nativeAppInstallAd.price) {
    ((UILabel *)appInstallAdView.priceView).text = nativeAppInstallAd.price;
    appInstallAdView.priceView.hidden = NO;
  } else {
    appInstallAdView.priceView.hidden = YES;
  }

  // In order for the SDK to process touch events properly, user interaction should be disabled on
  // all views associated with the GADNativeAppInstallAdView. Since UIButton has
  // userInteractionEnabled set to YES by default, views of this type must explicitly set
  // userInteractionEnabled to NO.
  appInstallAdView.callToActionView.userInteractionEnabled = NO;
}

Swift

// Mark: - GADNativeAppInstallAdLoaderDelegate

func adLoader(adLoader: GADAdLoader!,
    didReceiveNativeAppInstallAd nativeAppInstallAd: GADNativeAppInstallAd!) {
  // Create and place the ad in the view hierarchy.
  let appInstallAdView = NSBundle.mainBundle().loadNibNamed("NativeAppInstallAdView", owner: nil,
      options: nil).first as! GADNativeAppInstallAdView
  // TODO: Make sure to add the GADNativeAppInstallAdView to the view hierarchy.

  // Associate the app install ad view with the app install ad object. This is required to make
  // the ad clickable.
  appInstallAdView.nativeAppInstallAd = nativeAppInstallAd

  // Populate the app install ad view with the app install ad assets.
  // Some assets are guaranteed to be present in every app install ad.
  (appInstallAdView.headlineView as! UILabel).text = nativeAppInstallAd.headline
  (appInstallAdView.iconView as! UIImageView).image = nativeAppInstallAd.icon?.image
  (appInstallAdView.bodyView as! UILabel).text = nativeAppInstallAd.body
  (appInstallAdView.imageView as! UIImageView).image =
      (nativeAppInstallAd.images?.first as! GADNativeAdImage).image
  (appInstallAdView.callToActionView as! UIButton).setTitle(
      nativeAppInstallAd.callToAction, forState: UIControlState.Normal)

  // Other assets are not, however, and should be checked first.
  let starRatingView = appInstallAdView.starRatingView
  if let starRating = nativeAppInstallAd.starRating {
    (starRatingView as! UIImageView).image = imageOfStarsFromStarRating(starRating)
    starRatingView.hidden = false
  } else {
    starRatingView.hidden = true
  }

  let storeView = appInstallAdView.storeView
  if let store = nativeAppInstallAd.store {
    (storeView as! UILabel).text = store
    storeView.hidden = false
  } else {
    storeView.hidden = true
  }

  let priceView = appInstallAdView.priceView
  if let price = nativeAppInstallAd.price {
    (priceView as! UILabel).text = price
    priceView.hidden = false
  } else {
    priceView.hidden = true
  }

  // In order for the SDK to process touch events properly, user interaction should be disabled on
  // all views associated with the GADNativeAppInstallAdView. Since UIButton has
  // userInteractionEnabled set to true by default, views of this type must explicitly set
  // userInteractionEnabled to false.
  (appInstallAdView.callToActionView as! UIButton).userInteractionEnabled = false
}

E veja agora um método para exibir um anúncio de conteúdo na visualização definida acima:

Objective-C

#pragma mark GADNativeContentAdLoaderDelegate implementation

- (void)adLoader:(GADAdLoader *)adLoader
    didReceiveNativeContentAd:(GADNativeContentAd *)nativeContentAd {
  // Create and place ad in view hierarchy.
  GADNativeContentAdView *contentAdView =
      [[[NSBundle mainBundle] loadNibNamed:@"NativeContentAdView"
                                     owner:nil
                                   options:nil] firstObject];
  // TODO: Make sure to add the GADNativeContentAdView to the view hierarchy.

  // Associate the content ad view with the content ad object. This is required to make the ad
  // clickable.
  contentAdView.nativeContentAd = nativeContentAd;

  // Populate the content ad view with the content ad assets.
  // Some assets are guaranteed to be present in every content ad.
  ((UILabel *)contentAdView.headlineView).text = nativeContentAd.headline;
  ((UILabel *)contentAdView.bodyView).text = nativeContentAd.body;
  ((UIImageView *)contentAdView.imageView).image =
      ((GADNativeAdImage *)[nativeContentAd.images firstObject]).image;
  ((UILabel *)contentAdView.advertiserView).text = nativeContentAd.advertiser;
  [((UIButton *)contentAdView.callToActionView)setTitle:nativeContentAd.callToAction
                                               forState:UIControlStateNormal];

  // Other assets are not, however, and should be checked first.
  if (nativeContentAd.logo && nativeContentAd.logo.image) {
    ((UIImageView *)contentAdView.logoView).image = nativeContentAd.logo.image;
    contentAdView.logoView.hidden = NO;
  } else {
    contentAdView.logoView.hidden = YES;
  }

  // In order for the SDK to process touch events properly, user interaction should be disabled on
  // all views associated with the GADNativeContentAdView. Since UIButton has userInteractionEnabled
  // set to YES by default, views of this type must explicitly set userInteractionEnabled to NO.
  contentAdView.callToActionView.userInteractionEnabled = NO;
}

Swift

// Mark: - GADNativeContentAdLoaderDelegate

func adLoader(adLoader: GADAdLoader!,
    didReceiveNativeContentAd nativeContentAd: GADNativeContentAd!) {
  // Create and place the ad in the view hierarchy.
  let contentAdView = NSBundle.mainBundle().loadNibNamed("NativeContentAdView", owner: nil,
      options: nil).first as! GADNativeContentAdView
  // TODO: Make sure to add the GADNativeContentAdView to the view hierarchy.

  // Associate the content ad view with the content ad object. This is required to make the ad
  // clickable.
  contentAdView.nativeContentAd = nativeContentAd

  // Populate the content ad view with the content ad assets.
  // Some assets are guaranteed to be present in every content ad.
  (contentAdView.headlineView as! UILabel).text = nativeContentAd.headline
  (contentAdView.bodyView as! UILabel).text = nativeContentAd.body
  (contentAdView.imageView as! UIImageView).image =
      (nativeContentAd.images?.first as! GADNativeAdImage).image
  (contentAdView.advertiserView as! UILabel).text = nativeContentAd.advertiser
  (contentAdView.callToActionView as! UIButton).setTitle(
      nativeContentAd.callToAction, forState: UIControlState.Normal)

  // Other assets are not, however, and should be checked first.
  let logoView = contentAdView.logoView
  if let logoImage = nativeContentAd.logo?.image {
    (logoView as! UIImageView).image = logoImage
    logoView.hidden = false
  } else {
    logoView.hidden = true
  }

  // In order for the SDK to process touch events properly, user interaction should be disabled on
  // all views associated with the GADNativeContentAdView. Since UIButton has userInteractionEnabled
  // set to true by default, views of this type must explicitly set userInteractionEnabled to false.
  (contentAdView.callToActionView as! UIButton).userInteractionEnabled = false
}

Como você pode ver, os exemplos de código acima desativam a interação de usuários para o botão da IU que exibe a call-to-action. Se você usar os botões da IU para exibir recursos de anúncio nativos, também precisará desativar a interação dos usuários para que o SDK dos anúncios para dispositivos móveis do Google possa receber e processar eventos da IU adequadamente. Devido a essa etapa adicional, geralmente é recomendável evitar o uso de botões da IU e optar pelo uso do rótulo e do ImageView da IU.

Nosso repositório do GitHub tem as implementações completas para anúncios de instalação do app e de conteúdo com renderização personalizada nativa criados com as linguagens Swift e Objective-C.

Faça o download de um exemplo de renderização personalizada do DFP Custom

Como carregar formatos de anúncios nativos personalizados

Como ocorre com os formatos de anúncios definidos pelo sistema, os formatos de anúncios nativos personalizados são carregados usando objetos GADAdLoader. Com a inclusão da constante kGADAdLoaderAdTypeNativeCustomTemplate à sequência adTypes durante a inicialização de um objeto GADAdLoader, você configura esse objeto de modo que ele solicite formatos nativos personalizados ao carregar anúncios.

GADNativeCustomTemplateAdLoaderDelegate

O protocolo para o carregamento de modelos personalizados tem dois métodos. O primeiro é usado pelo GADAdLoader para descobrir quais IDs de modelos ele deve solicitar:

Objective-C

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

Swift

public func nativeCustomTemplateIDsForAdLoader(adLoader: GADAdLoader!) -> [AnyObject]!

Todos os formatos de anúncios nativos personalizados têm um ID de modelo correspondente. Quando esse método é chamado, seu aplicativo deve retornar uma sequência que contenha os IDs de modelos que ele está preparado para exibir.

A segunda mensagem é enviada depois do carregamento do anúncio de modelo personalizado, de modo semelhante ao que ocorre com os formatos definidos pelo sistema:

Objective-C

- (void)adLoader:(GADAdLoader *)adLoader
    didReceiveNativeCustomTemplateAd:(GADNativeCustomTemplateAd *)nativeCustomTemplateAd;

Swift

public func adLoader(adLoader: GADAdLoader!,
    didReceiveNativeCustomTemplateAd nativeCustomTemplateAd: GADNativeCustomTemplateAd!)

IDs de modelo

Os IDs de modelo usados para referência exclusiva de formatos de anúncios nativos personalizados podem ser encontrados na IU do DFP em Criativos > seção Formatos de anúncios nativos da guia Exibição:

Os IDs de modelo dos formatos de anúncios nativos personalizados são exibidos abaixo dos nomes deles. Quando você clica em um dos nomes, é exibida uma tela de detalhe que mostra informações sobre os campos do modelo:

Nessa tela, é possível adicionar, editar e remover campos individuais. Observe a coluna ID variável à direita. Esses IDs são usados para acessar os recursos individuais. Discutiremos mais sobre eles na próxima seção.

Como exibir formatos de anúncios nativos personalizados

Os formatos de anúncios nativos personalizados apresentam uma diferença básica em relação aos formatos definidos pelo sistema: os editores podem definir seus próprios "modelos", ou listas de recursos, que compõem um anúncio. Por esse motivo, o processo de exibir anúncios nativos personalizados se diferencia dos formatos definidos pelo sistema de alguns modos:

  1. Como a função da classe GADNativeCustomTemplateAd é tratar os formatos de anúncios nativos personalizados criados, ela não tem os assistentes de acesso de recursos específicos. Assim, ela oferece métodos como imageForKey: e stringForKey:, que recebem o ID variável de um campo do modelo como argumento.
  2. Não existe uma classe de visualização de anúncio dedicada como GADNativeContentAdView para usar com o GADNativeCustomTemplateAd. Você pode usar qualquer interface que seja viável para a sua experiência do usuário.
  3. Como não existe uma classe de visualização dedicada, não é necessário registrar as visualizações que você usa para exibir os recursos do anúncio.

Veja o exemplo de uma classe apta para exibir um GADNativeCustomTemplateAd simples:

MySimpleNativeAdView.h

Objective-C

@import UIKit;
@import GoogleMobileAds;

/// View representing a custom native ad format with template 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:(GADNativeCustomTemplateAd *)customNativeAd;

@end

Swift

import UIKit
import GoogleMobileAds

/// Custom native ad view class with template 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: GADNativeCustomTemplateAd) {
    ...
  }
}

MySimpleNativeAdView.m (excerto)

Objective-C

...
- (void)populateWithCustomNativeAd:(GADNativeCustomTemplateAd *)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"];
}
...

Swift

...
func populateWithCustomNativeAd(customNativeAd: GADNativeCustomTemplateAd) {
  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")
}
...

Como tratar cliques e impressões dos formatos de anúncios nativos personalizados

Com relação aos formatos de anúncios nativos personalizados, seu aplicativo fica responsável por registrar as impressões e informar os eventos de cliques ao SDK.

Como registrar as impressões

Para registrar uma impressão de um anúncio de modelo personalizado, chame o método recordImpression no GADNativeCustomTemplateAd correspondente:

Objective-C

[myCustomTemplateAd recordImpression];

Swift

myCustomTemplateAd.recordImpression()

O SDK evita automaticamente o registro de impressões duplicadas para uma única solicitação, caso seu aplicativo chame o método várias vezes para o mesmo anúncio por engano.

Como informar cliques

Para informar ao SDK que uma visualização de recurso recebeu um clique, chame o método performClickOnAssetWithKey:customClickHandler: no GADNativeCustomTemplateAd correspondente e passe o nome do recurso que foi clicado junto com um gerenciador de cliques personalizado opcional (veremos mais detalhes sobre isso abaixo). Por exemplo, se você tivesse um recurso chamado "MainImage" no seu modelo personalizado e quisesse informar um clique na visualização que correspondesse àquele recurso, seu código teria a seguinte aparência:

Objective-C

[myCustomTemplateAd performClickOnAssetWithKey:@"MainImage"
                            customClickHandler:^{ /* an optional block */ }];

Swift

myCustomTemplateAd.performClickOnAssetWithKey(
    assetKey: "MainImage", customClickHandler: { /* an optional closure */ })

É importante ressaltar que não é necessário chamar esse método para cada visualização de recursos associada ao seu anúncio. Se você tivesse outro recurso chamado "Caption" que deveria ser exibido, mas não estar disponível para cliques ou toques do usuário, seu aplicativo não teria que chamar performClickOnAssetWithKey:customClickHandler: para essa visualização do recurso.

Como responder às ações de cliques em anúncios personalizados

Quando um anúncio de modelo personalizado recebe um clique, existem três respostas possíveis do SDK, que são executadas nesta ordem:

  1. Invocar o customClickHandler como bloco do Objective-C ou encerramento no Swift, caso ele tenha sido passado.
  2. Pesquisar os URLs de link profundo do anúncio em loop e abrir o primeiro deles cujo aplicativo correspondente seja encontrado.
  3. Abrir um navegador e acessar o URL de destino padrão do anúncio.

O método performClickOnAssetWithKey:customClickHandler: aceita um bloco no Objective-C e um encerramento no Swift como segundo parâmetro. Se você passar um bloco ou encerramento, o SDK o executará e não realizará mais nenhuma ação. No entanto, se você passar um valor nulo, o SDK recorrerá aos URLs de destino e/ou de link profundo registrado com o anúncio.

Os gerenciadores de cliques em anúncios personalizados permitem que seu próprio aplicativo decida a melhor ação a ser realizada como resposta a um clique, seja atualizar a IU, apresentar outro controlador de visualizações ou somente registrar o clique. Veja um exemplo que mostra um alerta:

Objective-C

[self.customTemplateAd
    performClickOnAssetWithKey:@"MainImage"
            customClickHandler:^{
              [[[UIAlertView alloc] initWithTitle:@"Custom Click"
                                          message:@"You just clicked on the image!"
                                         delegate:self
                                cancelButtonTitle:@"OK"
                                otherButtonTitles:nil] show];
            }
];

Swift

customTemplateAd.performClickOnAssetWithKey(
    assetKey: "MainImage",
    customClickHandler: {
      let alertView = UIAlertView(title: "Custom Click",
          message: "You just clicked on the image!",
          delegate: self,
          cancelButtonTitle: "OK")
      alertView.alertViewStyle = .Default
      alertView.show()
    }
)

Como testar o código de anúncio nativo

Anúncios de vendas diretas

Se você tiver interesse em testar anúncios nativos de vendas diretas, poderá usar esse ID de bloco de anúncios do DFP:

/6499/example/native

Ele foi configurado para exibir amostras de anúncios de instalação do app e de conteúdo, além de um formato de anúncio nativo personalizado com os seguintes recursos:

  • Headline (texto)
  • MainImage (imagem)
  • Caption (texto)

O ID de modelo do formato de anúncio nativo personalizado é 10063170. No momento, os editores não devem usar a propriedade testDevices com as solicitações de anúncios nativos. A atual prática recomendada para realizar testes é o uso do ID de bloco de anúncios mostrado acima com dispositivos não registrados por meio da propriedade testDevices.

Anúncios de preenchimento nativo

Para testar o comportamento de anúncios de preenchimento nativo, use este bloco de anúncios do DFP:

/6499/example/native-backfill

Ele exibe anúncios de instalação do app e de conteúdo que incluem a sobreposição das Opções de anúncios.

Lembre-se de atualizar seu código para que ele consulte os IDs de modelo e o bloco de anúncios reais antes de colocá-lo em execução.

Enviar comentários sobre…

SDK for DFP Users on iOS
Precisa de ajuda? Acesse nossa página de suporte.