Formats d'annonces natives personnalisés

Formats d'annonces personnalisés

Tout comme leurs homologues définis par le système, les formats d'annonces natives personnalisés sont chargés à l'aide d'objets GADAdLoader. Si vous incluez la constante GADAdLoaderAdTypeCustomNative dans le tableau adTypes lors de l'initialisation d'un GADAdLoader, il est configuré pour demander des formats natifs personnalisés lors du chargement des annonces.

Remarque :Vous pouvez demander des formats natifs personnalisés et définis par le système simultanément avec une seule GADAdLoader si vous disposez d'un bloc d'annonces configuré pour diffuser plusieurs formats d'annonces. Ad Manager sélectionne la meilleure création native associée à l'un des formats que vous avez demandés.

GADCustomNativeAdLoaderDelegate

Le protocole de chargement des formats personnalisés comporte deux méthodes. Le premier est utilisé par GADAdLoader pour connaître les ID de format qu'il doit demander:

Swift

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

Objective-C

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

Chaque format personnalisé d'annonce native est associé à un ID qui l'identifie. Lorsque cette méthode est appelée, votre application doit renvoyer un tableau contenant les identifiants des formats des annonces qu'elle est prête à diffuser.

Le second message est envoyé lors du chargement de l'annonce native personnalisée, comme pour les formats définis par le système:

Swift

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

Objective-C

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

ID de format

Les ID de format utilisés pour faire référence de manière unique aux formats d'annonces natives personnalisés se trouvent dans Ad Manager l'UI, dans la section Native du menu déroulant Diffusion:

L'ID du format de chaque annonce native personnalisée s'affiche à côté de son nom. Cliquez sur l'un des noms pour accéder à un écran de détails contenant des informations sur les champs du format:

Vous pouvez alors ajouter, modifier et supprimer des champs individuels. Notez le nom de chacun des éléments. Le nom est la clé utilisée pour obtenir les données de chaque élément lors de l'affichage de votre format personnalisé d'annonce native.

Afficher des formats personnalisés d'annonces natives

Les formats d'annonces natives personnalisés diffèrent de ceux définis par le système dans la mesure où les éditeurs peuvent définir leur propre liste d'éléments qui composent une annonce. De ce fait, le processus d'affichage des annonces natives personnalisées diffère de celui des formats définis par le système à plusieurs égards:

1. Étant donné que GADCustomNativeAd est destiné à gérer tous les formats d'annonces natives personnalisés que vous créez, il ne possède pas d'accesseurs d'éléments nommés. À la place, il propose des méthodes telles que imageForKey: et stringForKey:, qui utilisent le nom du champ comme argument.
2. Il n'existe pas de classe d'affichage d'annonce dédiée comme GADNativeAdView à utiliser avec GADCustomNativeAd. Vous êtes libre d'utiliser l'affichage qui convient le mieux à votre expérience utilisateur.
3. Comme il n'existe pas de classe d'affichage d'annonce dédiée, vous n'avez pas besoin d'enregistrer les vues que vous utilisez pour afficher les composants de l'annonce.

Voici un exemple de vue d'annonce capable d'afficher une annonce native personnalisée 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

MySimpleNativeAdView.m (extrait)

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"];
}
...

Vidéo native pour les formats d'annonces natives personnalisés

Lorsque vous créez un format personnalisé, vous pouvez le rendre éligible pour les vidéos.

Dans l'implémentation de votre application, vous pouvez utiliser la propriété GADCustomNativeAd.mediaView pour obtenir la vue de la vidéo. Ajoutez ensuite cette vue à votre hiérarchie de vues. Si l'annonce ne comporte pas de contenu vidéo, envisagez d'autres plans afin de la diffuser sans vidéo.

Remarque :Contrairement aux annonces natives, qui contiennent une image dans la vue multimédia lorsque la vidéo n'est pas disponible, la vue multimédia d'une annonce native personnalisée ne comporte aucun contenu si elle ne contient pas de vidéo.

L'exemple ci-dessous vérifie si l'annonce comporte du contenu vidéo et affiche une image à la place si aucune vidéo n'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]];
}
...

Pour en savoir plus sur la personnalisation de l'expérience vidéo d'une annonce native personnalisée, consultez la section GADVideoController.

Téléchargez l'exemple d'affichage personnalisé Ad Manager pour voir un exemple pratique de vidéo native.

Gérer les impressions et les clics personnalisés sur des annonces natives

Pour les formats d'annonces natives personnalisés, votre application est chargée d'enregistrer les impressions et de signaler les événements de clic au SDK.

Impressions enregistrées

Pour enregistrer une impression pour une annonce native personnalisée, il vous suffit d'appeler la méthode recordImpression sur le GADCustomNativeAd correspondant:

Swift

myCustomNativeAd.recordImpression()

Objective-C

[myCustomNativeAd recordImpression];

Le SDK empêche l'enregistrement d'impressions en double pour une seule requête, si votre application appelle accidentellement la méthode plusieurs fois pour la même annonce.

Générer des rapports sur les clics

Pour signaler au SDK qu'un clic s'est produit sur une vue d'asset, appelez la méthode performClickOnAssetWithKey: au niveau de l'GADCustomNativeAd correspondant et transmettez le nom de l'asset sur lequel l'utilisateur a cliqué. Par exemple, si vous disposez d'un élément dans votre format personnalisé appelé "MainImage" et que vous souhaitez enregistrer un clic sur la vue correspondant à cet élément, votre code se présente comme suit:

Swift

myCustomNativeAd.performClickOnAsset(withKey: "MainImage")

Objective-C

[myCustomNativeAd performClickOnAssetWithKey:@"MainImage"];

Notez qu'il n'est pas nécessaire d'appeler cette méthode pour chaque vue de composant associée à votre annonce. Par exemple, si vous disposez d'un autre asset appelé "Caption" (Sous-titre), et que l'utilisateur ne clique pas dessus, votre application n'a pas besoin d'appeler performClickOnAssetWithKey: pour cette vue.

Répondre aux actions de clic personnalisé

GADCustomNativeAd comporte une propriété customClickHandler de type GADNativeAdCustomClickHandler.

Swift

typealias GADNativeAdCustomClickHandler = (assetID: String) -> Void

Objective-C

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

Un bloc (Objectif-C) ou une route fermée (Swift) acceptent un assetID comme paramètre d'entrée, qui identifie l'élément sur lequel l'utilisateur a cliqué.

Lorsqu'un clic est effectué sur une annonce native personnalisée, trois réponses possibles du SDK sont renvoyées dans l'ordre suivant:

1. Appelez le bloc customClickHandler dans Objectif-C ou le bloc Fermé dans Swift, le cas échéant.
2. Parcourez les URL des liens profonds de l'annonce et ouvrez la première pour laquelle une application correspondante peut être trouvée.
3. Ouvrez un navigateur et accédez à l'URL de destination standard de l'annonce.

La propriété customClickHandler accepte un bloc dans Goal-C et une route fermée dans Swift. Si vous définissez un blocage ou une fermeture, le SDK l'exécutera et n'effectuera aucune autre action. Toutefois, si vous définissez une valeur nulle, le SDK utilisera le lien profond et/ou les URL de destination enregistrés avec l'annonce.

Les gestionnaires de clics personnalisés permettent à votre application de déterminer elle-même la meilleure action à effectuer en réponse à un clic, qu'il s'agisse de mettre à jour l'UI, de présenter un autre contrôleur de vue ou simplement de consigner le clic. Voici un exemple d'alerte:

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"];

Au premier abord, l'existence de gestionnaires de clics personnalisés peut sembler étrange. Après tout, votre application vient d'indiquer au SDK qu'un clic s'est produit. Pourquoi le SDK doit-il se retourner et le signaler à l'application ?

Ce flux d'informations est utile pour plusieurs raisons, mais il permet surtout au SDK de garder le contrôle de la réponse au clic. Il peut pinguer automatiquement les URL de suivi tierces définies pour la création, par exemple, et gérer d'autres tâches en arrière-plan, sans code supplémentaire.

Tester le code d'annonce natif

Annonces vendues directement

Si vous souhaitez tester le fonctionnement des annonces natives vendues directement, vous pouvez utiliser cet Ad Manager ID de bloc d'annonces:

/6499/example/native

Elle est configurée pour diffuser des exemples d'annonces incitant à installer une application et d'annonces de contenu, ainsi qu'un format personnalisé d'annonce native avec les éléments suivants:

• Titre (texte)
• MainImage (image)
• Légende (texte)

Annonces de remplissage natives

Pour tester le comportement des annonces de remplissage natives, utilisez ce bloc d'annoncesAd Manager :

/6499/example/native-backfill

Elle diffusera des exemples d'annonces de contenu et d'installation d'applications incluant la superposition "Choisir sa pub".

N'oubliez pas de mettre à jour votre code de sorte qu'il fasse référence à vos identifiants réels de bloc d'annonces et de format avant de le diffuser.