在 iOS 应用中添加横幅广告和中矩形广告

通过 Audience Network,您可以借助 Facebook 广告让 iOS 应用实现变现。本指南介绍如何创建显示横幅广告和中矩形广告的 iOS 应用。

You can change placements in Monetization Manager to the Medium Rectangle format if these were previously configured as Banner for bidding. Similarly, for any new medium rectangle placements, navigate to the placement settings page in Monetization Manager and select Medium Rectangle (not Banner).

Placements will deliver as normal even if they are not changed to the medium rectangle format. However, to avoid confusion, we recommend that you change these placements to medium rectangle.

如果您有意了解其他类型的广告单元,请查看可用的广告单元类型清单

横幅广告和中矩形广告的添加步骤

让我们实现以下横幅广告版位。



第 1 步:加载并显示“广告视图”

第 2 步:验证展示次数和点击量记录

第 3 步:不展示广告时如何调试

第 4 步:测试广告集成

第 1 步:加载并显示“广告视图”

请务必先阅读完 iOS 设置指南,然后再继续后续步骤。

设计原生广告和横幅广告时,请务必遵守 iOS 布局指南,以便打造最佳的用户体验。

  1. 按照 iOS 入门指南的说明创建新项目后,打开 Main.storyboard。将 UIView 元素添加到主要 View 元素,并命名为 adContainer
  2. 现在,在您的视图控制器标头文件(若您使用 Swift,则为 Swift 文件)中,导入 FBAudienceNetwork,声明该控制器符合 FBAdViewDelegate 协议,并为该广告单元添加实例变量
    import UIKit
    import FBAudienceNetwork
    
    class ViewController: UIViewController, FBAdViewDelegate {
    
      @IBOutlet private var adContainer: UIView!
    
      private var adView: FBAdView?
    }
    #import <UIKit/UIKit.h>
    @import FBAudienceNetwork;
    
    @interface ViewController : UIViewController <FBAdViewDelegate>
    
    @property (nonatomic, weak) IBOutlet UIView *adContainer;
    @property (nonatomic, strong) FBAdView *adView;
    
    @end

  3. 将以下代码添加至 viewDidLoad;新建 FBAdView 的实例,然后将该实例添加到视图中。FBAdViewUIView 的子类。您可以将 FBAdView 添加到视图层次结构中,方法与任何其他视图一样。
    override func viewDidLoad() {
      super.viewDidLoad()
    
      // Instantiate an AdView object.
      // NOTE: the placement ID will eventually identify this as your app, you can ignore 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).
      let adView = FBAdView(placementID: "YOUR_PLACEMENT_ID", adSize: kFBAdSizeHeight50Banner, rootViewController: self)
      adView.frame = CGRect(x: 0, y: 0, width: 320, height: 250)
      adView.delegate = self
      adView.loadAd()
      self.adView = adView
    }
    - (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:kFBAdSizeHeight50Banner rootViewController:self];
      self.adView.frame = CGRectMake(0, 0, 320, 250);
      self.adView.delegate = self;
      [self.adView loadAd];
    }
    如要改为添加中矩形广告,您只需在 FBAdView 的 adSize 参数中提供 kFBAdSizeHeight250Rectangle 即可。

    Audience Network 支持在 FBAdView 中使用三种广告尺寸。广告单元的宽度可以调整,最小为 320 像素,只有高度已明确规定。

    广告格式 AdSize 参考 尺寸 建议

    中矩形横幅广告

    kFBAdSizeHeight 250Rectangle

    300x250

    强烈推荐此格式,因为此格式具备更出色的效果、更高的质量和更高的 CPU 效率

    标准横幅广告

    kFBAdSizeHeight 50Banner

    320x50

    这种格式适用于手机,但不推荐使用,因为效果和质量较差

    大型横幅广告

    kFBAdSizeHeight 90Banner

    320x90

    这种格式适用于平板电脑大屏设备,但不推荐使用,因为效果和质量较差

  4. 用您自己的版位编号字符串替换 YOUR_PLACEMENT_ID。如果没有版位编号或不知道如何获取版位编号,请参阅入门指南。选择设备作为构建目标并运行上述代码后,您应该会看到如下所示的结果:



在模拟器中投放广告时,应将设置更改为测试模式,以查看测试广告。详情请参阅如何使用测试模式

第 2 步:验证展示次数和点击量记录

您可以选择添加以下函数,用于处理广告关闭或用户点击广告的情况:

func adViewDidClick(_ adView: FBAdView) {
  print("Ad was clicked.")
}

func adViewDidFinishHandlingClick(_ adView: FBAdView) {
  print("Ad did finish click handling.")
}

func adViewWillLogImpression(_ adView: FBAdView) {
  print("Ad impression is being captured.")
}
- (void)adViewDidClick:(FBAdView *)adView
{
  NSLog(@"Ad was clicked.");
}

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

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

第 3 步:不显示广告时如何调试

在视图控制器中添加并实现以下两个委托函数,以处理广告加载失败的情况:

func adView(_ adView: FBAdView, didFailWithError error: Error) {
  print("Ad failed to load with error: \(error.localizedDescription)")
}

func adViewDidLoad(_ adView: FBAdView) {
  print("Ad was loaded and ready to be displayed")
  showAd()
}

private func showAd() {
  guard let adView = adView, adView.isAdValid else {
    return
  }
  adContainer.addSubview(adView)
}
- (void)adView:(FBAdView *)adView didFailWithError:(NSError *)error
{
  NSLog(@"Ad failed to load with error: %@", error);
}

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

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

当未显示任何广告时,系统将调用 adView:didFailWithError:,其中 error.code 会设置为 1001。如果您使用自己的自定义报告或中介层,则可能需要检查代码值并检测这一情况。在这种情况下,您可回退至另一个广告网络,但不能立即重新请求广告。


后续步骤

  • 查看说明如何使用原生广告的代码示例。NativeAdSample 是 SDK 的一部分,可在 FBAudienceNetwork/samples 文件夹下找到。使用 Xcode 打开项目,然后在设备或模拟器上运行。