Banner Ads

Banner ads are rectangular image or text ads that occupy a spot within an app's layout. They stay on screen while users are interacting with the app, and can refresh automatically after a certain period of time. If you're new to mobile advertising, they're a great place to start.

This guide shows you how to integrate banner ads from AdMob into an iOS app. In addition to code snippets and instructions, it includes information about sizing banners properly and links to additional resources.

Prerequisites

Create a GADBannerView

AdMob banners are displayed in GADBannerView objects, so the first step toward integrating AdMob ads is to include a GADBannerView in your view hierarchy. This is typically done in one of two ways.

Interface Builder

A GADBannerView can be added to a storyboard or xib file like any typical view. When using this method, be sure to add width and height constraints to match the ad size you'd like to display. For example, when displaying a standard banner (320x50), use a width constraint of 320 points, and a height constraint of 50 points.

Programmatically

A GADBannerView can also be instantiated directly. Here's an example of how to create a GADBannerView with the standard banner size of 320x50:

Swift

import GoogleMobileAds
import UIKit

class ViewController: UIViewController {

  var bannerView: GADBannerView!

  override func viewDidLoad() {
    super.viewDidLoad()
    bannerView = GADBannerView(adSize: kGADAdSizeFullBanner)
    self.view.addSubview(bannerView)
  }
}

Objective-C

@import GoogleMobileAds;

@interface ViewController ()

@property(nonatomic, strong) GADBannerView *bannerView;

@end

@implementation ViewController

- (void)viewDidLoad {
  [super viewDidLoad];
  self.bannerView = [[GADBannerView alloc]
      initWithAdSize:kGADAdSizeBanner];
  [self.view addSubview:self.bannerView];
}

@end

Configure GADBannerView properties

In order to load and display ads, GADBannerView requires a few properties be set.

  • rootViewController - This view controller is used to present an overlay when the ad is clicked. It should normally be set to the view controller that contains the GADBannerView.
  • adUnitID - This is the AdMob ad unit ID from which the GADBannerView should load ads.

Here's a code example showing how to set the two properties in the viewDidLoad method of a UIViewController:

Swift

override func viewDidLoad() {
  super.viewDidLoad()
  bannerView = GADBannerView(adSize: kGADAdSizeFullBanner)
  self.view.addSubview(bannerView)
  bannerView.adUnitID = "ca-app-pub-3940256099942544/2934735716"
  bannerView.rootViewController = self
}

Objective-C

- (void)viewDidLoad {
  [super viewDidLoad];
  self.bannerView = [[GADBannerView alloc]
      initWithAdSize:kGADAdSizeBanner];
  [self.view addSubview:self.bannerView];
  self.bannerView.adUnitID = @"ca-app-pub-3940256099942544/2934735716";
  self.bannerView.rootViewController = self;
}

Ad unit IDs are created in the AdMob UI, and represent a place in your app where ads appear. If you show banner ads in two view controllers, for example, you can create an ad unit for each one.

Call loadRequest

Once the GADBannerView is in place and its properties configured, it's time to load an ad. This is done by calling the [loadRequest:](/admob/ios/api/reference/Classes/GADAdLoader#-loadrequest method, which takes a GADRequest object as its argument:

Swift

override func viewDidLoad() {
  super.viewDidLoad()
  bannerView = GADBannerView(adSize: kGADAdSizeFullBanner)
  self.view.addSubview(bannerView)
  bannerView.adUnitID = "ca-app-pub-3940256099942544/2934735716"
  bannerView.rootViewController = self
  bannerView.load(GADRequest())
}

Objective-C

- (void)viewDidLoad {
  [super viewDidLoad];
  self.bannerView = [[GADBannerView alloc]
      initWithAdSize:kGADAdSizeBanner];
  [self.view addSubview:self.bannerView];
  self.bannerView.adUnitID = @"ca-app-pub-3940256099942544/2934735716";
  self.bannerView.rootViewController = self;
  [self.bannerView loadRequest:[GADRequest request]];
}

GADRequest objects represent a single ad request, and contain properties for things like targeting information.

Always test with test ads

The sample code above contains an ad unit ID and you're free to request ads with it. It's been specially configured to return test ads rather than production ads for every request, which makes it safe to use.

However, once you register an app in the AdMob UI and create your own ad unit IDs for use in your app, you'll need to explicitly configure your device as a test device when you're developing. This is extremely important. Testing with real ads (even if you never tap on them) is against AdMob policy and can cause your account to be suspended. See Test Ads for information on how you can make sure you always get test ads when developing.

The following banner sizes are supported:

Size (WxH) Description Availability AdSize constant
320x50 Standard banner Phones and tablets kGADAdSizeBanner
320x100 Large banner Phones and tablets kGADAdSizeLargeBanner
300x250 IAB medium rectangle Phones and tablets kGADAdSizeMediumRectangle
468x60 IAB full-size banner Tablets kGADAdSizeFullBanner
728x90 IAB leaderboard Tablets kGADAdSizeLeaderboard
Screen width x 32|50|90 Smart banner Phones and tablets kGADAdSizeSmartBannerPortrait
kGADAdSizeSmartBannerLandscape

If an app tries to load a banner that's too big for its layout, the SDK won't display it. Instead, an error message will be written to the log.

Smart Banners

Smart Banners are ad units that render screen-width banner ads on any screen size across different devices in either orientation. Smart Banners help deal with increasing screen fragmentation across different devices by "smartly" detecting the width of the device in its current orientation and making the ad view that size.

Three ad heights are implemented in smart banners:

Ad height Screen height
32dp ≤ 400dp
50dp > 400dp and ≤ 720dp
90dp > 720dp

Typically, Smart Banners on phones have a height of 50dp in portrait and 32dp in landscape. On tablets, height is normally 90dp in both orientations.

When an image ad isn't large enough to take up the entire allotted space, the image will be centered, and the space on either side will be filled in.

To use Smart Banners, just specify kGADAdSizeSmartBannerPortrait for the ad size:

Swift

let bannerView = GADBannerView(adSize: kGADAdSizeSmartBannerPortrait)

Objective-C

GADBannerView *bannerView = [[GADBannerView alloc]
      initWithAdSize:kGADAdSizeSmartBannerPortrait];

Additional resources

Samples

Mobile Ads Garage video tutorials

Next steps

Send feedback about...

AdMob for iOS
AdMob for iOS
Need help? Visit our support page.