Adding Ad Banners to your iOS app

The Audience Network allows you to monetize your iOS apps with Facebook ads. This guide explains how to create an iOS app that shows banner ads. If you're interested in other kinds of ad units, see the list of available types.

Let's implement the following banner ad placement.



Step 1: Load and Show Banner Ad View

Step 2: Verify Impression and Click Logging

Step 3: How to Debug When Ad Not Shown

Step 4: Test Ads Integration

Step 1: Load and Show Banner Ad View

Ensure you have completed the Audience Network Getting Started and iOS Getting Started guides before you proceed.

When designing native ads and banner ads, ensure you have followed iOS layout guideline for optimal user experience.

  1. After you have created a new project from iOS Getting Started guides, open Main.storyboard. Add a UIView element to the main View element and name it to adContainer.
  2. Next, import the SDK header, declare that ViewController implements the FBAdViewDelegate protocol, and add a function that initializes the banner view.
    #import <UIKit/UIKit.h>
    @import FBAudienceNetwork;
    
    @interface ViewController : UIViewController <FBAdViewDelegate>
    
    @property (weak, nonatomic) IBOutlet UIView *adContainer;
    @property (nonatomic, strong) FBAdView *adView;
    
    @end
  3. Open ViewController.m and find the viewDidLoad implementation. Add the code below to create a new instance of FBAdView and add it to the view. FBAdView is a subclass of UIView. You can add it to your view hierarchy just like any other view.
    - (void)viewDidLoad
    {
      [super viewDidLoad];
      // Instantiate an AdView object. 
      // NOTE: the placement ID will eventually identify this as your App, you can ignore it for
      // now, while you are testing and replace it later when you have signed up.
      // While you are using this temporary code you will only get test ads and if you release
      // your code like this to the App Store your users will not receive ads (you will get a no fill error).
      self.adView = [[FBAdView alloc] initWithPlacementID:@"YOUR_PLACEMENT_ID"
                                                   adSize:kFBAdSizeHeight250Rectangle
                                       rootViewController:self];
      self.adView.frame = CGRectMake(0, 0, 300, 250);
      self.adView.delegate = self;
      [self.adView loadAd];
    }

    Audience Network supports three ad sizes to be used in your `AdView`. The Banner unit's width is flexible with a minimum of 320px, and only the height is defined.

    Ad Format AdSize Reference Size Recommendation

    Medium Rectangle

    kFBAdSizeHeight 250Rectangle

    320x250

    This banner format is highly recommended because it provides higher performance, higher quality, and more CPU efficient

    Standard Banner

    kFBAdSizeHeight 50Banner

    320x50

    This banner format is suited to phones but not recommended because of poor performance and quality

    Large Banner

    kFBAdSizeHeight 90Banner

    320x90

    This banner format is suited to tablets and larger devices but not recommended because of poor performance and quality

  4. Replace YOUR_PLACEMENT_ID with your own placement id string. If you don't have a placement id or don't know how to get one, refer to the Getting Started Guide. Choose your build target to be device and run the above code, you should see something like this:



When running ads in the simulator, change the setting to test mode to view test ads. Please go to How to Use Test Mode for more information.

Step 2: Verify Impression and Click Logging

Optionally, you can add the following functions to handle the cases where the banner ad is closed or when the user clicks on it:

- (void)adViewDidClick:(FBAdView *)adView
{
    NSLog(@"Banner ad was clicked.");
}

- (void)adViewDidFinishHandlingClick:(FBAdView *)adView
{
    NSLog(@"Banner ad did finish click handling.");
}

- (void)adViewWillLogImpression:(FBAdView *)adView
{
    NSLog(@"Banner ad impression is being captured.");
}

Step 3: How to Debug When Ad Not Shown

Add and implement the following two functions in your View Controller implementation file to handle ad loading failures and completions:

- (void)adView:(FBAdView *)adView didFailWithError:(NSError *)error
{
  NSLog(@"Ad failed to load");
}

- (void)adViewDidLoad:(FBAdView *)adView
{
  NSLog(@"Ad was loaded and ready to be displayed");
  [self showBanner];
}

- (void)showBanner
{
  if (self.adView && self.adView.isAdValid) {
    [self.adContainer addSubview:self.adView];
  }
}

When there is no ad to show, the adView:didFailWithError: will be called with error.code set to 1001. If you use your own custom reporting or mediation layer, you may want to check the code value and detect this case. You can fallback to another ad network in this case, but do not re-request an ad immediately after.


Next Steps