バナー広告

バナー広告は、アプリのレイアウトの一部を占める長方形の広告です。ユーザーはアプリを操作している間、画面の上部または下部に固定されます。ユーザーがスクロールすると、コンテンツの横に固定されます。バナー広告は一定期間経過後に自動的に更新されます。詳しくは、 バナー広告の概要をご覧ください。

このガイドでは、 アンカー アダプティブ バナー広告の利用方法をご紹介します。指定した広告の幅を使用して各デバイスの広告サイズを最適化することで、パフォーマンスを最大化できます。

アンカー アダプティブ バナー広告は、通常の固定サイズの広告ではなく、固定のアスペクト比の広告です。アスペクト比は業界標準 320×50 とほぼ同じです。利用可能な全幅を指定すると、その幅に最適な高さの広告が返されます。同じデバイスからのリクエストによって最適な高さが変わることはなく、広告の更新時に周囲のビューを移動させる必要もありません。

前提条件

必ずテスト広告でテストする

アプリの作成とテストの際は、実際の実際の広告ではなく、テスト広告を使用してください。実際の広告を使用すると、アカウントが停止される可能性があります。

以下の Android バナー向けのテスト専用広告ユニット ID を使用すると、テスト広告を簡単に読み込むことができます。

/6499/example/adaptive-banner

この ID は、すべてのリクエストに対してテスト広告を返すように構成されており、アプリのコーディング、テスト、デバッグの際に使用できます。なお、テスト用 ID は、アプリを公開する前に必ずご自身の広告ユニット ID に置き換えてください。

Mobile Ads SDK のテスト広告の仕組みについて詳しくは、テスト広告をご覧ください。

レイアウトに AdManagerAdView を追加する

バナーを表示するには、まず、表示したい Activity または Fragment のレイアウトに AdManagerAdView を配置します。

Java

private AdSize getAdSize() {
  // Determine the screen width (less decorations) to use for the ad width.
  Display display = getWindowManager().getDefaultDisplay();
  DisplayMetrics outMetrics = new DisplayMetrics();
  display.getMetrics(outMetrics);

  float density = outMetrics.density;

  float adWidthPixels = adContainerView.getWidth();

  // If the ad hasn't been laid out, default to the full screen width.
  if (adWidthPixels == 0) {
    adWidthPixels = outMetrics.widthPixels;
  }

  int adWidth = (int) (adWidthPixels / density);
  return AdSize.getCurrentOrientationAnchoredAdaptiveBannerAdSize(this, adWidth);
}

private void loadBanner() {
  
  // Create a new ad view.
  AdManagerAdView adView = new AdManagerAdView(this);
  adView.setAdSizes(getAdSize());
  adView.setAdUnitId("/6499/example/adaptive-banner");

  // Replace ad container with new ad view.
  adContainerView.removeAllViews();
  adContainerView.addView(adView);

  // Start loading the ad in the background.
  AdManagerAdRequest adRequest = new AdManagerAdRequest.Builder().build();
  adView.loadAd(adRequest);
}

Kotlin


// Determine the screen width (less decorations) to use for the ad width.
// If the ad hasn't been laid out, default to the full screen width.
private val adSize: AdSize
  get() {
    val display = windowManager.defaultDisplay
    val outMetrics = DisplayMetrics()
    display.getMetrics(outMetrics)

    val density = outMetrics.density

    var adWidthPixels = binding.adViewContainer.width.toFloat()
    if (adWidthPixels == 0f) {
      adWidthPixels = outMetrics.widthPixels.toFloat()
    }

    val adWidth = (adWidthPixels / density).toInt()
    return AdSize.getCurrentOrientationAnchoredAdaptiveBannerAdSize(this, adWidth)
  }

private fun loadBanner() {
  
  // Create a new ad view.
  val adView = AdManagerAdView(this)
  adView.adSizes = adSize
  adView.adUnitId = "/6499/example/adaptive-banner"

  // Create an ad request.
  val adRequest = AdManagerAdRequest.Builder().build()

  // Start loading the ad in the background.
  adView.loadAd(adRequest)
}

広告を読み込む

AdManagerAdView を実装したら、次のステップとして広告を読み込みます。これは、AdManagerAdView クラスの loadAd() メソッドで行います。このメソッドは AdManagerAdRequest パラメータを受け取ります。このパラメータには、1 つの広告リクエストに関するランタイム情報(ターゲティング情報など)が格納されています。

ActivityonCreate() メソッドで広告を読み込む方法の例を次に示します。

Java

private void loadBanner() {
  // Create a new ad view.
  adView = new AdManagerAdView(this);
  adView.setAdUnitId(AD_UNIT);
  adView.setAdSize(getAdSize());
  
  // Replace ad container with new ad view.
  adContainerView.removeAllViews();
  adContainerView.addView(adView);

  // Start loading the ad in the background.
  AdManagerAdRequest adRequest = new AdManagerAdRequest.Builder().build();
  adView.loadAd(adRequest);
}

Kotlin

private fun loadBanner() {
  // This is an ad unit ID for a test ad. Replace with your own banner ad unit ID.
  adView.adUnitId = "/6499/example/banner"
  adView.setAdSize(adSize)
  
  // Create an ad request.
  val adRequest = AdManagerAdRequest.Builder().build()

  // Start loading the ad in the background.
  adView.loadAd(adRequest)
}

広告ユニットの更新を設定していれば、広告の読み込みに失敗した場合でも、別の広告を明示的にリクエストする必要はありません。Google Mobile Ads SDK では、管理画面で指定された更新頻度が適用されます。 Ad Manager更新を有効にしていない場合は、新しいリクエストを発行する必要があります。

これで、これで、アプリでバナー広告を表示する準備が整いました。

広告イベント

広告の動作をさらにカスタマイズするには、広告のライフサイクルで生じるさまざまなイベント(読み込み、開始、終了など)を利用します。これらのイベントをリッスンするには、AdListener クラスを使用します。

AdManagerAdViewAdListener を使用するには、setAdListener() メソッドを呼び出します。

Java

AdManagerAdView.setAdListener(new AdListener() {
    @Override
    public void onAdClicked() {
      // Code to be executed when the user clicks on an ad.
    }

    @Override
    public void onAdClosed() {
      // Code to be executed when the user is about to return
      // to the app after tapping on an ad.
    }

    @Override
    public void onAdFailedToLoad(LoadAdError adError) {
      // Code to be executed when an ad request fails.
    }

    @Override
    public void onAdImpression() {
      // Code to be executed when an impression is recorded
      // for an ad.
    }

    @Override
    public void onAdLoaded() {
      // Code to be executed when an ad finishes loading.
    }

    @Override
    public void onAdOpened() {
      // Code to be executed when an ad opens an overlay that
      // covers the screen.
    }
});

Kotlin

AdManagerAdView.adListener = object: AdListener() {
    override fun onAdClicked() {
      // Code to be executed when the user clicks on an ad.
    }

    override fun onAdClosed() {
      // Code to be executed when the user is about to return
      // to the app after tapping on an ad.
    }

    override fun onAdFailedToLoad(adError : LoadAdError) {
      // Code to be executed when an ad request fails.
    }

    override fun onAdImpression() {
      // Code to be executed when an impression is recorded
      // for an ad.
    }

    override fun onAdLoaded() {
      // Code to be executed when an ad finishes loading.
    }

    override fun onAdOpened() {
      // Code to be executed when an ad opens an overlay that
      // covers the screen.
    }
}

AdListener のオーバーライド可能な各メソッドは、広告のライフサイクルで生じるイベントに対応しています。

オーバーライド可能なメソッド
onAdClicked() onAdClicked() メソッドは、広告のクリックが記録されたときに呼び出されます。
onAdClosed() onAdClosed() メソッドは、ユーザーが広告のリンク先 URL にアクセスした後にアプリに戻ると呼び出されます。一時停止中のアクティビティを再開したり、アプリを操作できるようにするためのその他の作業を実行したりできます。
onAdFailedToLoad() onAdFailedToLoad() メソッドは、パラメータを含む唯一のメソッドです。LoadAdError タイプのエラー パラメータは、発生したエラーを示します。詳細については、広告読み込みエラーのデバッグに関するドキュメントをご覧ください。
onAdImpression() onAdImpression() メソッドは、広告のインプレッションが記録されたときに呼び出されます。
onAdLoaded() onAdLoaded() メソッドは、広告の読み込みが完了すると実行されます。たとえば、広告が確実に読み込まれるまで、アクティビティやフラグメントへの AdManagerAdView の追加を遅らせる場合は、このメソッドを使用します。
onAdOpened() onAdOpened() メソッドは、広告が画面全体に表示されるオーバーレイを開くと呼び出されます。

インプレッションの手動カウント

インプレッションの手動カウントは、アド マネージャーで直接入稿するクリエイティブを使用する直接販売キャンペーンと自社キャンペーンでのみ使用できます。バックフィルの広告または第三者ネットワーク広告には使用できません。詳しくは、インプレッションとクリックのカウントをご覧ください。

インプレッションを記録するタイミングについて特別な条件がある場合は、インプレッションの ping をアド マネージャーに手動で送信できます。そのためには、広告を読み込む前に、手動インプレッションに対して AdManagerAdRequest を有効にします。

Java

AdManagerAdRequest adRequest = new AdManagerAdRequest.Builder()
    .setManualImpressionsEnabled(true)
    .build();

Kotlin

val adRequest = AdManagerAdRequest.Builder()
    .setManualImpressionsEnabled(true)
    .build()

広告が正常に返され、画面に表示されていることを確認したら、インプレッションを手動で記録できます。

Java

AdManagerAdView.recordManualImpression();

Kotlin

AdManagerAdView.recordManualImpression()

アプリ内イベント

アプリイベントを使用すると、アプリコードにメッセージを送信できる広告を作成できます。アプリは、これらのメッセージに基づいてアクションを実行できます。

アド マネージャー固有のアプリ内イベントをリッスンするには、AppEventListener を使用します。 これらのイベントは、広告ライフサイクルのあらゆるタイミングで(onAdLoaded() が呼び出される前でも)発生する可能性があります。

Java

public interface AppEventListener {
  void onAppEvent(String name, String info);
}

Kotlin

interface AppEventListener {
    fun onAppEvent(name: String, info: String)
}

void onAppEvent(String name, String info) は、広告でアプリイベントが発生すると呼び出されます。このインターフェースは、アクティビティまたは他の任意のオブジェクトで実装できます。

Java

import com.google.android.gms.ads.admanager.*;

public class BannerExample extends Activity implements AppEventListener {
}

Kotlin

import com.google.android.gms.ads.admanager.*

class BannerExample : Activity(), AppEventListener {
}

その後、AdManagerAdView に渡されます。

Java

AdManagerAdView.setAppEventListener(this);

Kotlin

AdManagerAdView.appEventListener = this

次の例は、色の名前を持つアプリイベントに応じてアプリの背景色を変更する方法を示しています。

Java

@Override
public void onAppEvent(String name, String info) {
  if ("color".equals(name)) {
    if ("green".equals(info)) {
      // Set background color to green.
    } else if ("blue".equals(info)) {
      // Set background color to blue.
    } else {
      // Set background color to black.
    }
  }
}

Kotlin

override fun onAppEvent(name: String?, info: String?) {
    if (name == "color") {
        when (info) {
            "green" -> {
                // Set background color to green.
            }
            "blue" -> {
                // Set background color to blue.
            }
            else -> {
                // Set background color to black.
            }
        }
    }
}

また、対応するクリエイティブは次のとおりです。これは、色に関するアプリ内イベント メッセージをリスナーに送信するものです。

<html>
<head>
  <script src="//www.gstatic.com/afma/api/v1/google_mobile_app_ads.js"></script>
  <script>
    document.addEventListener("DOMContentLoaded", function() {
      // Send a color=green event when ad loads.
      admob.events.dispatchAppEvent("color", "green");

      document.getElementById("ad").addEventListener("click", function() {
        // Send a color=blue event when ad is clicked.
        admob.events.dispatchAppEvent("color", "blue");
      });
    });
  </script>
  <style>
    #ad {
      width: 320px;
      height: 50px;
      top: 0px;
      left: 0px;
      font-size: 24pt;
      font-weight: bold;
      position: absolute;
      background: black;
      color: white;
      text-align: center;
    }
  </style>
</head>
<body>
  <div id="ad">Carpe diem!</div>
</body>
</html>

iOS API デモアプリでアプリ内イベントを実装するには、アド マネージャーによるアプリ内イベントの実装例をご覧ください。

Java Kotlin

動画広告のハードウェア アクセラレーション

バナー広告ビューに動画広告を正常に表示するには、ハードウェア アクセラレーションを有効にする必要があります。

ハードウェア アクセラレーションはデフォルトで有効になっていますが、一部のアプリでは無効にできます。これに該当する場合は、広告を使用する Activity クラスでハードウェア アクセラレーションを有効にすることをおすすめします。

ハードウェア アクセラレーションの有効化

グローバルでハードウェア アクセラレーションをオンにしてアプリが適切に動作しない場合は、個々のアクティビティでも制御できます。ハードウェア アクセラレーションを有効または無効にするには、AndroidManifest.xml<application> 要素と <activity> 要素に android:hardwareAccelerated 属性を使用します。次の例では、アプリ全体でハードウェア アクセラレーションを有効にしていますが、1 つのアクティビティでは無効にしています。

<application android:hardwareAccelerated="true">
    <!-- For activities that use ads, hardwareAcceleration should be true. -->
    <activity android:hardwareAccelerated="true" />
    <!-- For activities that don't use ads, hardwareAcceleration can be false. -->
    <activity android:hardwareAccelerated="false" />
</application>

ハードウェア アクセラレーションを制御するオプションの詳細については、ハードウェア アクセラレーション ガイドをご覧ください。アクティビティが無効になっている場合、個々の広告ビューでハードウェア アクセラレーションを有効にできないため、アクティビティ自体でハードウェア アクセラレーションを有効にする必要があります。

参考情報

GitHub の例

  • アンカー アダプティブ バナー広告の例: Java | Kotlin

次のステップ

折りたたみ可能バナー

折りたたみ可能バナー広告は、最初は大きなオーバーレイとして表示されるバナー広告で、広告を小さいサイズに折りたたむためのボタンが付いています。パフォーマンスをさらに最適化するために 使用を検討してください詳しくは、折りたたみ可能バナー広告をご覧ください。

インライン アダプティブ バナー

インライン アダプティブ バナーは、アンカー アダプティブ バナーよりも大きくて背の高いバナーです。高さは可変で、デバイス画面と同じ高さにすることができます。スクロール可能なコンテンツにバナー広告を配置するアプリでは、アンカー アダプティブ バナー広告よりもインライン アダプティブ バナーをおすすめします。詳しくは、インライン アダプティブ バナーをご覧ください。

他のトピックを見る