Google Mobile Ads SDK

Banners I

Banner ads use a small portion of the screen to entice users to "click through" to a richer, full-screen experience such as a website or app store page. This guide shows you how to enable your app to serve a banner ad.

Android (Google Play)

These instructions pertain to the Mobile Ads APIs in Google Play services.

To display banners in your Android app, simply add a com.google.android.gms.ads.AdView to your UI.

Adding a com.google.android.gms.ads.AdView

Android apps are composed of View objects, which are Java instances the user sees as text areas, buttons and other controls. AdView is simply another View subclass displaying small HTML5 ads that respond to user touch.

Like any View, an AdView may be created either purely in code or largely in XML.

Here is the code for an Activity that will create and display a banner ad:

package com.google.example.gms.ads.banner;

import com.google.android.gms.ads.AdRequest;
import com.google.android.gms.ads.AdSize;
import com.google.android.gms.ads.AdView;

import android.app.Activity;
import android.os.Bundle;
import android.widget.LinearLayout;

/**
 * A simple {@link Activity} that embeds an AdView.
 */
public class BannerSample extends Activity {
  /** The view to show the ad. */
  private AdView adView;

  /* Your ad unit id. Replace with your actual ad unit id. */
  private static final String AD_UNIT_ID = "INSERT_YOUR_AD_UNIT_ID_HERE";

  /** Called when the activity is first created. */
  @Override
  public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);

    // Create an ad.
    adView = new AdView(this);
    adView.setAdSize(AdSize.BANNER);
    adView.setAdUnitId(AD_UNIT_ID);

    // Add the AdView to the view hierarchy. The view will have no size
    // until the ad is loaded.
    LinearLayout layout = (LinearLayout) findViewById(R.id.linearLayout);
    layout.addView(adView);

    // Create an ad request. Check logcat output for the hashed device ID to
    // get test ads on a physical device.
    AdRequest adRequest = new AdRequest.Builder()
        .addTestDevice(AdRequest.DEVICE_ID_EMULATOR)
        .addTestDevice("INSERT_YOUR_HASHED_DEVICE_ID_HERE")
        .build();

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

  @Override
  public void onResume() {
    super.onResume();
    if (adView != null) {
      adView.resume();
    }
  }

  @Override
  public void onPause() {
    if (adView != null) {
      adView.pause();
    }
    super.onPause();
  }

  /** Called before the activity is destroyed. */
  @Override
  public void onDestroy() {
    // Destroy the AdView.
    if (adView != null) {
      adView.destroy();
    }
    super.onDestroy();
  }
}

Warning: Make sure you're in test mode during development to avoid being disabled for clicking your own ads. See the Additional Controls guide for more details on enabling test ads.

You can download an example project containing this code here.

The Result

When you now run your app you should see a banner at the top of the screen:

Proceed to the next guide to learn more about banner ads.

Android (6.4.1 and earlier SDKs)

To display banners in your Android app, simply add a com.google.ads.AdView to your UI.

Adding a com.google.ads.AdView

Android apps are composed of View objects, which are Java instances the user sees as text areas, buttons and other controls. AdView is simply another View subclass displaying small HTML5 ads that respond to user touch.

Like any View, an AdView may be created either purely in code or largely in XML.

The five lines of code it takes to add a banner:

  • Import com.google.ads.*
  • Declare an AdView instance
  • Create it, specifying the ad unit ID
  • Add the view to the UI
  • Load it with an ad

The easiest place to do all this is in your app's Activity.

import com.google.ads.*;

public class BannerExample extends Activity {
  private AdView adView;

  @Override
  public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.main);

    // Create the adView
    adView = new AdView(this, AdSize.BANNER, MY_AD_UNIT_ID);

    // Lookup your LinearLayout assuming it's been given
    // the attribute android:id="@+id/mainLayout"
    LinearLayout layout = (LinearLayout)findViewById(R.id.mainLayout);

    // Add the adView to it
    layout.addView(adView);

    // Initiate a generic request to load it with an ad
    adView.loadAd(new AdRequest());
  }

  @Override
  public void onDestroy() {
    if (adView != null) {
      adView.destroy();
    }
    super.onDestroy();
  }
}

You can download an example project containing this code here.

The Result

When you now run your app you should see a banner at the top of the screen:

Proceed to the next guide to learn more about banner ads.

iOS

To display banner ads in your iOS app, simply add a GADBannerView to your UI.

Adding a GADBannerView

iOS apps are composed of UIView objects, Objective-C instances the user sees as text areas, buttons and other controls. GADBannerView is simply a UIView subclass displaying small HTML5 ads that respond to user touch.

Like any UIView, a GADBannerView is easy to create in code.

The seven lines of code it takes to add a banner:

  • Import GADBannerView.h
  • Declare a GADBannerView instance in your app's UIViewController
  • Create it
  • Set the ad unit ID
  • Set the "root view controller"
  • Add the view to the UI
  • Load it with an ad

The best place to do all this is in your app's UIViewController.

// BannerExampleViewController.h

// Import GADBannerView's definition from the SDK
#import "GADBannerView.h"

@interface BannerExampleViewController : UIViewController {
  // Declare one as an instance variable
  GADBannerView *bannerView_;
}

@end

The following performs banner setup in the view controller's viewDidLoad initialization hook.

// BannerExampleViewController.m

#import "BannerExampleViewController.h"

@implementation BannerExampleViewController

- (void)viewDidLoad {
  [super viewDidLoad];

  // Create a view of the standard size at the top of the screen.
  // Available AdSize constants are explained in GADAdSize.h.
  bannerView_ = [[GADBannerView alloc] initWithAdSize:kGADAdSizeBanner];

  // Specify the ad unit ID.
  bannerView_.adUnitID = MY_BANNER_UNIT_ID;

  // Let the runtime know which UIViewController to restore after taking
  // the user wherever the ad goes and add it to the view hierarchy.
  bannerView_.rootViewController = self;
  [self.view addSubview:bannerView_];

  // Initiate a generic request to load it with an ad.
  [bannerView_ loadRequest:[GADRequest request]];
}

- (void)dealloc {

  // Don't release the bannerView_ if you are using ARC in your project
  [bannerView_ release];
  [super dealloc];
}

@end

You can download an example project containing this code here.

The Result

The outcome should be a banner at the top of your app:

Proceed to the next guide to learn more about banner ads.

Windows Phone 8

Windows Phone 8 apps are composed of controls the user sees, such as text areas, buttons and other UI elements. AdView is simply another control displaying ads that respond to user touch.

Adding a banner ad

  1. Locate the AdView control in the Toolbox menu. Note that this is different from the AdControl control. Skip to step 2 if you've already got the AdView control in your toolbox.

    Right click in the Toolbox and select Choose Items.... Click Browse on the menu that pops up and select the GoogleAds.dll file you previously downloaded (if you downloaded the package using NuGet, you should be able to find it in the packages folder in your project). Make sure the AdView control is selected from the GoogleAds namespace, then click OK.

  2. Like many controls, AdView is most easily specified in XAML markup. One way to do this is to drag the AdView control from your Toolbox into the pane that shows the output of your XAML markup.

    Alternatively, you can just define the AdView using the markup below directly in your XAML markup file.

    <GoogleAds:AdView AdUnitID="MY_AD_UNIT_ID" Format="MY_AD_FORMAT" />
    

    where

    • MY_AD_UNIT_ID should be replaced with your actual AdMob ad unit ID
    • MY_AD_FORMAT should be replaced with the AdFormats constant you wish to request. Banner and SmartBanner are currently supported.

    You can download an example project containing this code here.

    Define a banner ad with code

    You may alternatively create your AdView in C#:

    using GoogleAds;
    
    namespace BannerExample
    {
      public partial class MainPage : PhoneApplicationPage
      {
        // Constructor
        public MainPage()
        {
          InitializeComponent();
          AdView bannerAd = new AdView
          {
            Format = AdFormats.BANNER,
            AdUnitID = "MY_AD_UNIT_ID"
          };
          AdRequest adRequest = new AdRequest();
          // Assumes we've defined a Grid that has a name
          // directive of ContentPanel.
          ContentPanel.Children.Add(bannerAd);
          bannerAd.LoadAd(adRequest);
        }
      }
    }
    

You can download an example project containing this code here.

The Result

When you run your app in the Windows Phone Emulator, you should see a banner on screen:

Proceed to the next guide to learn more about banner ads.

Authentication required

You need to be signed in with Google+ to do that.

Signing you in...

Google Developers needs your permission to do that.