Thêm quảng cáo biểu ngữ và quảng cáo hình chữ nhật cỡ trung bình vào ứng dụng iOS

Với Audience Network, bạn có thể kiếm tiền từ ứng dụng iOS của mình bằng quảng cáo trên Facebook. Hướng dẫn này giải thích cách tạo một ứng dụng iOS hiển thị quảng cáo biểu ngữ và quảng cáo hình chữ nhật cỡ trung bình.

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.

Nếu bạn quan tâm đến các loại đơn vị quảng cáo khác, hãy xem danh sách các loại có sẵn.

Các bước tạo quảng cáo biểu ngữ và quảng cáo hình chữ nhật cỡ trung bình

Hãy triển khai vị trí quảng cáo biểu ngữ sau đây.



Bước 1: Tải và hiển thị chế độ xem quảng cáo

Bước 2: Xác minh quá trình ghi lượt hiển thị và lượt click

Bước 3: Cách gỡ lỗi khi quảng cáo không hiển thị

Bước 4: Kiểm tra tiện ích tích hợp quảng cáo

Bước 1: Tải và hiển thị chế độ xem quảng cáo

Đảm bảo bạn đã xem hết Hướng dẫn thiết lập trên iOS trước khi tiếp tục.

Khi thiết kế quảng cáo tự nhiên và quảng cáo biểu ngữ, đảm bảo bạn tuân thủ Nguyên tắc về bố cục của iOS để có trải nghiệm người dùng tối ưu.

  1. Sau khi bạn tạo dự án mới từ hướng dẫn Bắt đầu trên iOS, hãy mở Main.storyboard. Thêm một thành phần UIView vào thành phần View chính và đặt tên là adContainer.
  2. Lúc này, trong file tiêu đề Trình kiểm soát chế độ xem (hoặc file Swift nếu bạn là người dùng Swift), hãy nhập FBAudienceNetwork, tuyên bố tuân thủ giao thức FBAdViewDelegate và thêm biến phiên bản cho đơn vị quảng cáo
    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. Thêm mã bên dưới vào viewDidLoad; Tạo một phiên bản mới của FBAdView rồi thêm vào chế độ xem. FBAdView là lớp phụ của UIView. Bạn có thể thêm lớp đó vào phân cấp chế độ xem giống như với bất kỳ chế độ xem nào khác.
    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];
    }
    Để thêm quảng cáo Hình chữ nhật cỡ trung bình, bạn chỉ cần cung cấp kFBAdSizeHeight250Rectangle trong thông số adSize cho FBAdView.

    Audience Network hỗ trợ 3 kích thước quảng cáo sẽ được sử dụng trong FBAdView. Chiều rộng linh hoạt của đơn vị tối thiểu là 320px, chỉ có chiều cao là xác định.

    Định dạng quảng cáo Tham chiếu kích thước quảng cáo Kích thước Đề xuất

    Hình chữ nhật cỡ trung bình

    kFBAdSizeHeight 250Rectangle

    300x250

    Bạn nên dùng định dạng này vì định dạng này mang lại hiệu quả cao hơn, chất lượng tốt hơn và tiết kiệm CPU hơn

    Biểu ngữ thông thường

    kFBAdSizeHeight 50Banner

    320x50

    Định dạng này phù hợp với điện thoại nhưng bạn không nên dùng vì có hiệu quả và chất lượng thấp

    Biểu ngữ lớn

    kFBAdSizeHeight 90Banner

    320x90

    Định dạng này phù hợp với máy tính bảng và các thiết bị lớn hơn, nhưng bạn không nên dùng vì có hiệu quả và chất lượng thấp

  4. Thay thế YOUR_PLACEMENT_ID bằng chuỗi id vị trí quảng cáo của chính bạn. Nếu bạn không có id vị trí quảng cáo hoặc không biết cách lấy id này, hãy tham khảo Hướng dẫn bắt đầu. Chọn mục tiêu bản dựng là thiết bị và chạy mã ở trên, bạn sẽ nhìn thấy nội dung như sau:



Khi chạy quảng cáo trong trình mô phỏng, hãy thay đổi cài đặt sang chế độ thử nghiệm để xem quảng cáo thử nghiệm. Vui lòng truy cập Cách sử dụng chế độ thử nghiệm để biết thêm thông tin.

Bước 2: Xác minh quá trình ghi lượt hiển thị và lượt click

Nếu muốn, bạn có thể thêm những hàm sau để xử lý các trường hợp quảng cáo bị đóng hoặc khi người dùng nhấp vào quảng cáo đó:

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.");
}

Bước 3: Cách gỡ lỗi khi quảng cáo không hiển thị

Thêm và triển khai 2 hàm ủy quyền sau đây trong Trình kiểm soát chế độ xem để xử lý lỗi tải quảng cáo:

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];
  }
}

Khi không có quảng cáo nào để hiển thị, adView:didFailWithError: sẽ được gọi với error.code được đặt thành 1001. Nếu sử dụng lớp trung gian hoặc báo cáo tùy chỉnh riêng, bạn nên kiểm tra giá trị mã và phát hiện trường hợp này. Bạn có thể chuyển đổi dự phòng sang một mạng quảng cáo khác trong trường hợp này. Tuy nhiên, không yêu cầu lại quảng cáo ngay sau đó.


Các bước tiếp theo

  • Khám phá các mẫu mã của chúng tôi minh họa cách sử dụng quảng cáo tự nhiên. NativeAdSample khả dụng như một phần của SDK và có thể tìm được trong thư mục FBAudienceNetwork/samples. Mở dự án có Xcode và chạy trên thiết bị hoặc trình mô phỏng.