カスタム ネイティブ広告フォーマット

カスタム広告フォーマット

システム定義のネイティブ広告フォーマットと同様に、カスタムのネイティブ広告フォーマットは GADAdLoader オブジェクトを使用して読み込みます。GADAdLoader の初期化時に GADAdLoaderAdTypeCustomNative 定数を adTypes 配列に含めると、広告の読み込み時にカスタムのネイティブ フォーマットをリクエストするよう設定できます。

GADCustomNativeAdLoaderDelegate

カスタム形式を読み込むプロトコルには 2 つのメソッドがあります。1 つ目は GADAdLoader が、リクエストする必要があるフォーマット ID を探すために使用されます。

Swift

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

Objective-C

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

すべてのカスタムのネイティブ広告フォーマットには、それを識別する、対応するフォーマット ID があります。このメソッドが呼び出されると、アプリは、表示準備が完了した広告のフォーマット ID を含む配列を返す必要があります。

2 つ目のメッセージは、カスタム ネイティブ広告の読み込み時に送信されます。システム定義のフォーマットの場合と同様です。

Swift

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

Objective-C

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

形式 ID

カスタムのネイティブ広告フォーマットを一意に参照するために使用されるフォーマット ID は、 Ad Manager 管理画面の [配信] プルダウンの [ネイティブ] セクションで確認できます。

各カスタム ネイティブ広告フォーマットのフォーマット ID は、名前の横に表示されます。 名前のいずれかをクリックすると、詳細画面が表示され、その形式のフィールドに関する情報を確認できます。

ここで、個々のフィールドを追加、編集、削除できます。各アセットの名前をメモします。この名前は、カスタムのネイティブ広告フォーマットを表示するときに各アセットのデータを取得するために使用されるキーです。

カスタムのネイティブ広告フォーマットを表示する

カスタムのネイティブ広告フォーマットは、システム定義のネイティブ広告フォーマットとは異なり、パブリッシャーが広告を構成するアセットのリストを独自に定義できます。そのため、カスタムのネイティブ広告を表示するプロセスは、システム定義のフォーマットで行うプロセスとは次の点で異なります。

  1. GADCustomNativeAd は、お客様が作成したカスタム ネイティブ広告フォーマットをすべて処理することを目的としているため、名前付きアセット アクセサーがありません。代わりに、フィールドの名前を引数として受け取る imageForKey:stringForKey: などのメソッドが用意されています。
  2. GADCustomNativeAd で使用する GADNativeAdView のような専用の広告ビュークラスはありません。ユーザー エクスペリエンスにとって適切なビューを自由に使用できます。
  3. 専用の広告ビュークラスがないため、広告のアセットの表示に使用するビューを登録する必要はありません。

シンプルなカスタム ネイティブ広告を表示できる広告ビューの例を次に示します。

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(抜粋)

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

カスタムのネイティブ広告フォーマット用のネイティブ動画

カスタム フォーマットを作成する場合は、そのフォーマットを動画で使用することもできます。

アプリの実装では、GADCustomNativeAd.mediaView プロパティを使用して動画のビューを取得できます。次に、このビューをビュー階層に追加します。広告に動画コンテンツがない場合は、動画なしで広告を表示する別のプランを作成します。

次の例では、広告に動画コンテンツが含まれているかどうかを確認し、動画がない場合は広告の代わりに画像を表示します。

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

カスタム ネイティブ広告の動画エクスペリエンスをカスタマイズする方法について詳しくは、GADVideoController をご覧ください。

ネイティブ動画の実際の動作例については、アド マネージャーのカスタム レンダリングのサンプルをダウンロードしてください。

カスタム ネイティブ広告のクリックとインプレッションの処理

カスタムのネイティブ広告フォーマットの場合、アプリはインプレッションの記録と、クリック イベントを SDK に報告します。

インプレッションの記録

カスタム ネイティブ広告のインプレッションを記録するには、対応する GADCustomNativeAdrecordImpression メソッドを呼び出します。

Swift

myCustomNativeAd.recordImpression()

Objective-C

[myCustomNativeAd recordImpression];

SDK は、アプリが同じ広告に対して誤ってメソッドを複数回呼び出した場合に、1 回のリクエストでインプレッションが重複して記録されないようにします。

クリック数のレポート

アセットビューでクリックが発生したことを SDK に報告するには、対応する GADCustomNativeAdperformClickOnAssetWithKey: メソッドを呼び出し、クリックされたアセットの名前を渡します。たとえば、「MainImage」というカスタム フォーマットのアセットがあり、そのアセットに対応するビューへのクリックを報告する場合、コードは次のようになります。

Swift

myCustomNativeAd.performClickOnAsset(withKey: "MainImage")

Objective-C

[myCustomNativeAd performClickOnAssetWithKey:@"MainImage"];

広告に関連付けられているすべてのアセットビューに対してこのメソッドを呼び出す必要はありません。たとえば、「Caption」という別のアセット(表示されるがユーザーがクリックまたはタップしないもの)がある場合は、アプリでそのビューに対して performClickOnAssetWithKey: を呼び出す必要はありません。

カスタム クリック アクションへの応答

GADCustomNativeAdGADNativeAdCustomClickHandler 型のプロパティ customClickHandler がある

Swift

typealias GADNativeAdCustomClickHandler = (assetID: String) -> Void

Objective-C

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

これは、assetID を入力パラメータとして受け取るブロック(Objective-C)/ クロージャ(Swift)です。これにより、クリックされたアセットを識別します。

カスタム ネイティブ広告がクリックされると、SDK から 3 つのレスポンスが次の順序で試行されます。

  1. Objective-C の customClickHandler ブロックまたは Swift のクロージャ(設定されている場合)を呼び出します。
  2. 広告のディープリンク URL をループ処理して、一致するアプリが見つかる最初の URL を開きます。
  3. ブラウザを開き、広告の従来のリンク先 URL に移動します。

customClickHandler プロパティは、Objective-C のブロックと Swift のクロージャを受け入れます。ブロックまたはクロージャを設定すると、SDK によって実行されます。それ以上の処理は行われません。ただし、nil 値を設定した場合、SDK は広告に登録されているディープリンクまたはリンク先 URL にフォールバックします。

カスタム クリック ハンドラを使用すると、クリックへの応答として最適なアクション(UI の更新、別のビュー コントローラの表示、クリックの記録のみ)をアプリが決定できるようになります。アラートを表示する例を次に示します。

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

ネイティブ広告コードをテストする

直接販売広告

直接販売のネイティブ広告がどのようなものかテストする場合は、次の広告ユニット ID を使用します。 Ad Manager

/6499/example/native

サンプルのアプリ インストール広告とコンテンツ広告に加えて、次のアセットを含むカスタムのネイティブ広告フォーマットを配信するように構成されています。

  • 見出し(テキスト)
  • メインイメージ(画像)
  • キャプション(テキスト)

ネイティブ バックフィル広告

ネイティブ バックフィル広告の動作をテストするには、次のAd Manager 広告ユニットを使用します。

/6499/example/native-backfill

AdChoices オーバーレイを含むアプリ インストール広告とコンテンツ広告のサンプルが配信されます。

配信開始前に、実際の広告ユニット ID とフォーマット ID を参照するようコードを更新してください。