概要

Vpon 橫幅廣告 (Banner) 是利用畫面的一小部分展示廣告來吸引使用者點擊，廣告被點擊後即可打開全螢幕呈現更豐富的內容，例如網站或應用程式商店網頁。

完成串接準備

在開始串接廣告之前，請確認您已經將 Vpon SDK 導入您的 Xcode 專案中。若您尚未完成，請先參考串接說明完成相關設定。

iOS 應用程式由 UIView 物件所組成，也就是以文字區域和按鈕等控制項的形式向使用者顯示的 Objective-C 執行個體。VpadnBanner 是一種 UIView 子類別，用來顯示由使用者點擊觸發的小型 HTML5 廣告。

和所有的 UIView 一樣，用程式碼編寫 VpadnBanner 很簡單。以下為所需步驟：

Import VpadnSDKAdKit
宣告 VpadnBanner
初始化 VpadnBanner 物件，並指定 License Key
建立 VpadnRequest 物件，並請求廣告
實作 Delegate protocol

建議您可以在應用程式的 ViewController 內執行上述步驟。

Import VpadnSDKAdKit 並宣告 VpadnBanner

Obejctive-C

@import VpadnSDKAdKit;
// Import Vpon SDK

@interface ViewController() <VpadnBannerDelegate>
@property (strong, nonatomic) VpadnBanner *vpadnBanner;
@property (weak, nonatomic) IBOutlet UIView *loadBannerView;

@end

Swift

import VpadnSDKAdKit
// Import Vpon SDK

class VponSdkBannerViewController: UIViewController {
  @IBOutlet weak var requestButton: UIButton!
  @IBOutlet weak var loadBannerView: UIView!
}

初始化 VpadnBanner 物件

請參考以下程式碼初始化橫幅廣告，並指定 License Key

Objective-C

_vpadnBanner = [[VpadnBanner alloc] initWithLicenseKey:@"License Key" adSize: VpadnAdSizeBanner];
// initWithLicenseKey: Vpon License Key to get ad, please replace with your own one
// adSize: The Banner Ad size that will be displayed

_vpadnBanner.delegate = self;

Swift

vpadnBanner = VpadnBanner.init(licenseKey: "License Key", adSize: VpadnAdSizeBanner)
// licenseKey: Vpon License Key to get ad, please replace with your own one
// adSize: The Banner Ad size that will be displayed

vpadnBanner.delegate = self

建立 VpadnRequest 物件，並請求廣告

在發出廣告請求前，請先建立 VpadnRequest 物件：

Objective-C

VpadnAdRequest *request = [[VpadnAdRequest alloc] init];

[request setAutoRefresh:YES];
// Only available for Banner Ad, will auto refresh ad if set YES

[request setTestDevices:@[[ASIdentifierManager sharedManager].advertisingIdentifier.UUIDString]];
// Set your test device's IDFA here if you're trying to get Vpon test ad

[_vpadnBanner loadRequest:request];
// Start to load ad

Swift

let request = VpadnAdRequest.init()

request.setAutoRefresh(true)
// Only available for Banner Ad, will auto refresh ad if set YES

request.setTestDevices([ASIdentifierManager.shared().advertisingIdentifier.uuidString])
// Set your test device's IDFA here if you're trying to get Vpon test ad

vpadnBanner.load(request)
// start to load ad

Note

您可以為每種類型的廣告都建立不同的 VpadnRequest 物件，或是在所有的廣告請求中都使用同一個 VpadnRequest 物件

如果您想要指定更多投放條件，請參考進階設定

實作 Delegate protocol

完成廣告請求後，您可以實作以下函數監聽廣告狀態：

Objective-C

- (void) onVpadnAdLoaded:(VpadnBanner *)banner {
    // Invoked if receive Banner Ad successfully

    [self.loadBannerView addSubview:banner.getVpadnAdView];
    // Add ad view to your layout
}
- (void) onVpadnAd:(VpadnBanner *)banner failedToLoad:(NSError *)error {
    // Invoked if received ad fail, check this callback to indicates what type of failure occurred
}
- (void) onVpadnAdWillLeaveApplication:(VpadnBanner *)banner {
    // Invoked if user leave the app and the current app was backgrounded
}
- (void) onVpadnAdRefreshed:(VpadnBanner *)banner {
   // Invoked if the Banner Ad will be refresh
}

Swift

extension VponSdkBannerViewController : VpadnBannerDelegate {

    func onVpadnAdLoaded(_ banner: VpadnBanner) {
      // Invoked if receive Banner Ad successfully

      self.loadBannerView.addSubview(banner.getVpadnAdView())
      // Add ad view to your layout
    }
    func onVpadnAd(_ banner: VpadnBanner, failedToLoad error: Error) {
      // Invoked if received ad fail, check this callback to indicates what type of failure occurred
    }
    func onVpadnAdWillLeaveApplication(_ banner: VpadnBanner) {
      // Invoked if user leave the app and the current app was backgrounded
    }
    func onVpadnAdRefreshed(_ banner: VpadnBanner) {
      // Invoked if the Banner Ad will be refresh 
    }
}

橫幅廣告尺吋

除了標準尺吋 (320x50) 的橫幅廣告外，Vpon 還支援多種不同尺吋的橫幅廣告：

尺吋 (寬x高)	說明	VponAdSize 常數值	適用裝置
320x50	標準橫幅廣告	VpadnAdSizeBANNER	iPhone iPad
468x60	IAB 全橫幅廣告	VpadnAdSizeFullBanner	iPad
728x90	IAB 超級橫幅廣告	VpadnAdSizeLeaderboard	iPad
300x250	IAB 中矩形廣告	VpadnAdSizeMediumRectangle	iPhone iPad
320x480	大型橫幅廣告	VpadnAdSizeLargeRectangle	iPhone iPad
device width x auto height	Smart Banner Portrait	VpadnAdSizeSmartBannerPortrait	iPhone iPad
device width x auto height	Smart Banner Landscape	VpadnAdSizeSmartBannerLandscape	iPhone iPad

Tips

確認廣告曝光是否成功發送

請注意，Vpon SDK 不允許廣告以以下方式呈現，致使廣告在畫面上可能不可見：

將 AdView 設為 Hidden
將 AdView 的 Alpha 值設為 < 1.0
AdView 被其它 View(s) 遮蓋住

當廣告露出在頁面上並達到曝光標準後，會印出以下的 Log 代表有送出廣告曝光：

<VPON> [NOTE] Send impression successfully

Sample Code

如果您想看到完整的串接實例，請參考我們的 Sample Code

適用於 Vpon SDK v4.9 的串接方法

如果您想了解 Vpon SDK v4.9.4 或以下版本的串接方法，請參考橫幅廣告

iOS - 橫幅廣告

概要

完成串接準備

開始撰寫 Banner

Import VpadnSDKAdKit 並宣告 VpadnBanner

Obejctive-C

Swift

初始化 VpadnBanner 物件

Objective-C

Swift

建立 VpadnRequest 物件，並請求廣告

Objective-C

Swift

實作 Delegate protocol

Objective-C

Swift

橫幅廣告尺吋

Tips

確認廣告曝光是否成功發送

Sample Code

適用於 Vpon SDK v4.9 的串接方法