ネイティブ エクスプレス広告

このガイドでは、Google Mobile Ads SDK を使用して AdMob ネイティブ エクスプレス広告を iOS アプリに表示する方法を説明します。 GADNativeExpressAdView をレイアウトに追加する方法、広告をリクエストする方法などについて説明します。

事前準備

このガイドでは、Google Mobile Ads SDK の実践的な知識を前提としています。予備的知識がない場合は、スタートガイドを通読されることをおすすめします。

ネイティブ エクスプレス広告の概要

ネイティブ エクスプレス広告は、ストーリーボードに配置してサイズを自由に調整できるバナー広告のような長方形の広告フォーマットです。 バナー広告との主な違いは、広告ユニット用の CSS テンプレートをアップロードすることで、広告表示の詳細(画像サイズ、フォント、色など)を制御できるという点です。 AdMob が、そのテンプレートと広告主のアセット(アイコン、画像、テキストなど)を組み合わせて、結果を GADNativeExpressAdView に表示します。 この方法では、自然な形でアプリに広告を表示しながら、ネイティブ エクスプレスに必要なモバイルコードの量を最小限に抑えることができます。

ネイティブ エクスプレス広告の広告ユニットを作成する

ネイティブ エクスプレス広告は、apps.admob.com で作成します。 広告フォーマットの概要と、広告ユニットに合わせたテンプレート サイズの選択の詳細については、ヘルプセンターの記事をご覧ください。 自然でコンテンツの邪魔にならないネイティブ エクスプレス広告の CSS を作成する方法については、ネイティブ エクスプレス広告の CSS ガイドをご覧ください。

GADNativeExpressAdView

GADNativeExpressAdView クラスは、ネイティブ エクスプレス広告のリクエストと表示に使用します。 GADBannerView でもできますが、このクラスは、ストーリーボードに追加して制約を割り当てることができます。

サイズを選択する

ネイティブ エクスプレス広告にはテンプレート サイズが複数あり、広告ユニットの作成時に選択します。それぞれ高さと幅の値の範囲があり、固定のサイズから選択する必要はありません。

テンプレート サイズ 最小幅 最大幅 最小高さ 最大高さ
280 1200 80 612
280 1200 132 1200
280 1200 250 1200

「中」サイズのテンプレートを表示したい場合、幅 280~1200 dp、高さ 132~1200 dp の範囲で使用できます。 つまり、サイズ 300x200, 450x150、613x572 はいずれも「中」テンプレート サイズとして有効です。 ただし、すべてのサイズが適切な表示になるとは限りません。 1200x80 の「小」テンプレートをリクエストすることは技術的には可能ですが、おすすめしません。広告を表示する端末の画面寸法も必ず考慮してください。 大サイズは一般的に、タブレットへの表示用として予約されています。

アプリは、すべてのリクエストに対して同じサイズを使用する必要はありません。 1 つのサイズの同じ広告ユニットが縦向きや横向きでリクエストされることも、表示される特定の端末に応じて異なるサイズでリクエストされることもあります。 アプリが、広告ユニット テンプレートの範囲を超える広告サイズをリクエストした場合は、エラーが返されます。

GADNativeExpressAdViewGADAdSize をプログラムで作成するときに GADAdSizeFullWidthPortraitWithHeight() メソッドや GADAdSizeFullWidthLandscapeWithHeight() メソッドを使用することもできます。 その場合は、広告が端末画面の幅いっぱいに表示されます。

現在、流動サイズは、ネイティブ エクスプレス広告では使用できません。

広告を読み込む

広告の読み込みは、GADNativeExpressAdView クラスの loadRequest: メソッドを通じて行います。 これを呼び出す前に、広告の読み込みに先立って adUnitID プロパティと rootViewContoller プロパティが割り当てられていることを確認してください。

ストーリーボードに GADNativeExpressAdView を持つ UIViewController がある場合に、プロパティを設定して広告を読み込む方法を以下に示します。

Objective-C

#import "ViewController.h"

@import GoogleMobileAds;

@interface ViewController ()

@property(nonatomic, weak) IBOutlet GADNativeExpressAdView *nativeExpressAdView;

@end

@implementation ViewController

- (void)viewDidLoad {
  [super viewDidLoad];

  self.nativeExpressAdView.adUnitID = @"ca-app-pub-3940256099942544/2562852117";
  self.nativeExpressAdView.rootViewController = self;

  GADRequest *request = [GADRequest request];
  [self.nativeExpressAdView loadRequest:request];
}

@end

Swift

import GoogleMobileAds
import UIKit

class ViewController: UIViewController {
  @IBOutlet weak var nativeExpressAdView: GADNativeExpressAdView!

  override func viewDidLoad() {
    super.viewDidLoad()
    nativeExpressAdView.adUnitID = "ca-app-pub-3940256099942544/2562852117"
    nativeExpressAdView.rootViewController = self

    let request = GADRequest()
    nativeExpressAdView.load(request)
  }
}

その他の情報

ネイティブ エクスプレス広告を効果的に使用するための情報について、以下のリソースをご覧ください。

GitHub からサンプル プロジェクトをダウンロードして、実際に動作するネイティブ エクスプレス広告も参照できます。

フィードバックを送信...