Banner Ads

Banner ads usually appear at the top or bottom of your app’s screen. Adding one to your app takes just a few lines of code.


Before integrating banner ads in your app:

  1. Go through the steps in our Get Started guide to create an account on MoPub and integrate the SDK into your project.

  2. Create an ad unit in the Publisher UI (refer here for instructions). You will need that ad unit’s ID later to request ads from MoPub. (You can retrieve your ad unit ID by clicking Get code snippet in the top right corner of the Ad Unit page.)

  3. Be sure to initialize the MoPub SDK before loading an ad.

Loading Banner Ads in Your App

Starting with MoPub SDK v5.8.0, you can specify a desired ad size, and the MoPub SDK will request an ad for that size. To use that feature, ensure that you have set up the frame for your banner ad view before making your ad request. You can find additional information below tailored to your use cases.

Adding a banner to your application is a simple process:

  1. Edit your view controller’s header file.
  2. Edit your view controller’s implementation file.

Important: Please do not use publisher-provided overlays (such as close buttons) that are located with the ad placement and that subsequently cover the ad creative. Doing so is against MoPub Policy. If you have questions, please visit the Support Center and file a ticket for additional assistance.

Step 1. Edit Your View Controller’s Header File

  1. In your view controller’s header file, import the MPAdView.h header file and declare an MPAdView *adView instance.

  2. Declare that your view controller implements the MPAdViewDelegate protocol.

// MyViewController.h

#import "MPAdView.h"

@interface MyViewController : UIViewController <MPAdViewDelegate>

@property (nonatomic) MPAdView *adView;


Step 2. Edit Your View Controller’s Implementation File

  1. In your view controller’s implementation file, instantiate your adView, passing in your ad unit ID. This is typically done in -viewDidLoad.
  2. Register your view controller as the adView’s delegate.
  3. Set the adView’s frame at this time (either in code, Nib, or the Interface Builder), and add the adView to your controller’s view hierarchy.
  4. Center the adViewon screen to account for iPhone 6 and iPhone 6 Plus.
  5. Implement the -viewControllerForPresentingModalView MPAdViewDelegate method. The adView will use the view controller returned by this method to present modals when tapped. Typically, your controller can simply return self.
  6. Finally, load an ad:
    • Make sure the MoPub SDK has finished initializing first; for example:

         [[MoPub sharedInstance] initializeSdkWithConfiguration:sdkConfig completion:^{
         dispatch_async(dispatch_get_main_queue(), ^
         { [self.adView loadAdWithMaxAdSize:kMPPresetMaxAdSize250Height]; }
    • If you know the size of the banner you’d like to request, call loadAdWithMaxAdSize:custom_CGSize.
    • If you don’t know or have the size of the banner you’d like to request, and you’d like to use a constant, call loadAdWithMaxAdSize: and pass in one of the recognized MoPub ad size constants. The constants are height-based, and the complete list can be found here.
    • If you would like to use the frame as the maximum ad size, pass in the kMPPresetMaxAdSizeMatchFrame constant.
    • Ad requests must be made on the main thread.

Important: If you are using MRC, set the -fobjc-arc compiler flag on these files. Follow the instructions in our integration article.

// MyViewController.m

#import "MyViewController.h"

@implementation MyViewController

- (void)viewDidLoad {
    // ... your other -viewDidLoad code ...

    self.adView = [[MPAdView alloc] initWithAdUnitId:@"<YOUR_ADUNIT_ID_HERE>"];
    self.adView.delegate = self;
    // Ensure the adView's parent has a size set in order to use kMPPresetMaxAdSizeMatchFrame. Otherwise, give your adView's frame a specific size (e.g. 320 x 50)
    self.adView.frame = CGRectMake(0, 0, kMPPresetMaxAdSizeMatchFrame.width, kMPPresetMaxAdSizeMatchFrame.height);
    [self.view addSubview:self.adView];

    // You can pass in specific width and height to be requested
    [self.adView loadAdWithMaxAdSize:custom_CGSize];
    // Or you can use one of the height-based constants
    [self.adView loadAdWithMaxAdSize:kMPPresetMaxAdSize50Height];
    // Alternatively, you can use the frame as the maximum ad size
    [self.adView loadAdWithMaxAdSize:kMPPresetMaxAdSizeMatchFrame];

    [super viewDidLoad];

MPAdViewDelegate includes a variety of optional callbacks you can use to be notified of events; for example, when an ad has successfully loaded, or when the ad is about to present or dismiss a modal view. Refer to the MPAdViewDelegate for a list of these methods. Refer to our API Reference documentation for more details.

Note: adViewDidLoadAd callback provides the actual size of the ad that was successfully loaded. It is recommended to resize the size of MPAdView frame to match the height of the loaded ad.

Handling Rotation

If your application supports rotation, you can optionally forward orientation changes to the adView by calling -rotateToOrientation:. In some cases, the ad content may change its size upon rotation. To handle these cases properly, forward the orientation change, and resize and reposition.

- (void)willRotateToInterfaceOrientation:(UIInterfaceOrientation)toInterfaceOrientation
                                duration:(NSTimeInterval)duration {
    [self.adView rotateToOrientation:toInterfaceOrientation];

- (void)didRotateFromInterfaceOrientation:(UIInterfaceOrientation)fromInterfaceOrientation {
    CGSize size = [self.adView adContentViewSize];
    CGFloat centeredX = (self.view.bounds.size.width - size.width) / 2;
    CGFloat bottomAlignedY = self.view.bounds.size.height - size.height;
    self.adView.frame = CGRectMake(centeredX, bottomAlignedY, size.width, size.height);

Refreshing Ads

MPAdView automatically refreshes an ad unit at a time interval specified via the MoPub web interface. You can programmatically disable or enable auto-refresh on a particular MPAdView by calling -stopAutomaticallyRefreshingContents or -startAutomaticallyRefreshingContents.

There may be times when you want to manually refresh an ad. For instance, suppose your application has a UISearchBar, and you wish to use the search text as a targeting parameter for your ads. The following code example uses the -refreshAd method to accomplish this:

// UISearchBar delegate method. Notifies us when a user has attempted a search.
- (void)searchBarSearchButtonClicked:(UISearchBar *)searchBar {
    [self.adView setKeywords:searchBar.text];
    [self.adView refreshAd];

Sample Code

For a complete example of how to add banner ads into your app, check out the [MoPub sample app][].

Known Issue with WKWebView

Due to a known issue with WKWebView not respecting the ringer or mute switch settings to control volume, certain creatives may have audio on even when the device is on mute and the volume is non-zero.

Last updated September 07, 2021

TWITTER, MOPUB, and the Bird logo are trademarks of Twitter, Inc. or its affiliates. All third party logos and trademarks included are the property of their respective owners.

© 2021 MoPub (a division of Twitter, Inc.)