Native_Ad_iOS
- 開発環境にXcodeを使用することを前提とします。
iOS 8.0以降
- SDKをダウンロードします
↓ - 例を参考に広告表示の実装を行います
iOS SDK Getting Started / バナー広告からご確認ください。
loadRequestを行う前に、ネイティブ広告オブジェクトをdelegateメソッドで取得するためのsetUsePartsResponseの設定を行います。
/*
locationID: 管理画面から払い出された広告枠ID
adType: 枠サイズ kADG_AdType_Free:自由設定
rootViewController: 広告を配置するViewController
*/
self.adg = [[ADGManagerViewController alloc] initWithLocationID:@"48635"
adType:kADG_AdType_Free
rootViewController:self];
// HTMLテンプレートを使用したネイティブ広告を表示するためには以下のように配置するViewを指定します
self.adg.adSize = CGSizeMake(300, 250);
[self.adg addAdContainerView:self.adView];
self.adg.delegate = self;
// ネイティブ広告パーツ取得を有効
self.adg.usePartsResponse = YES;ネイティブ広告オブジェクトが取得できた場合、delegateメソッドの以下が呼び出されます。
- (void)ADGManagerViewControllerReceiveAd:(ADGManagerViewController *)adgManagerViewController
mediationNativeAd:(id)mediationNativeAdmediationNativeAdからネイティブ広告オブジェクトが取得できます。
ネイティブ広告オブジェクトはADGNativeAdクラスです。
参照するために、該当クラスにimportを追加してください。
#import <ADG/ADGNativeAd.h>id型からADGNativeAdへキャストし、クラス判定を行ってからアクセスしてください。
ADGNativeAdからネイティブ広告パーツを取得するパラメータは以下の通りです。
| 要素名 | object |
|---|---|
| タイトル | ADGNativeAd.title.text |
| メイン画像(長方形画像)URL | ADGNativeAd.mainImage.url |
| アイコン画像(正方形画像)URL | ADGNativeAd.iconImage.url |
| リード文 | ADGNativeAd.desc.value |
| CTA(Call to action)のテキスト | ADGNativeAd.ctatext.value |
| 広告主 | ADGNativeAd.sponsored.value |
#import "NativeAdsObjCViewController.h"
#import "ADGNativeAdView.h"
#import <ADG/ADGManagerViewController.h>
#import <ADG/ADGNativeAd.h>
@interface NativeAdsObjCViewController () <ADGManagerViewControllerDelegate>
@property (weak, nonatomic) IBOutlet UIView *adView;
@property (nonatomic) ADGManagerViewController *adg;
@end
@implementation NativeAdsObjCViewController
- (void)viewDidLoad {
[super viewDidLoad];
/*
locationID: 管理画面から払い出された広告枠ID
adType: 枠サイズ kADG_AdType_Free:自由設定
rootViewController: 広告を配置するViewController
*/
self.adg = [[ADGManagerViewController alloc] initWithLocationID:@"48635"
adType:kADG_AdType_Free
rootViewController:self];
// HTMLテンプレートを使用したネイティブ広告を表示するためには以下のように配置するViewを指定します
self.adg.adSize = CGSizeMake(300, 250);
[self.adg addAdContainerView:self.adView];
self.adg.delegate = self;
// ネイティブ広告パーツ取得を有効
self.adg.usePartsResponse = YES;
// インフォメーションアイコンのデフォルト表示
// デフォルト表示しない場合は必ずADGInformationIconViewの設置を実装してください
self.adg.informationIconViewDefault = false;
}
- (IBAction)didTapLoadRequestButton:(id)sender {
// 広告リクエスト
[self.adg loadRequest];
}
- (void)dealloc {
// インスタンスの破棄
self.adg.delegate = nil;
self.adg = nil;
}
- (void)ADGManagerViewControllerReceiveAd:(ADGManagerViewController *)adgManagerViewController {
NSLog(@"Received an ad.");
}
- (void)ADGManagerViewControllerReceiveAd:(ADGManagerViewController *)adgManagerViewController
mediationNativeAd:(id)mediationNativeAd {
NSLog(@"Received an ad.");
UIView *nativeAdView;
if ([mediationNativeAd isKindOfClass: [ADGNativeAd class]]) {
ADGNativeAdView *adgNativeAdView = [ADGNativeAdView view];
[adgNativeAdView apply:(ADGNativeAd *)mediationNativeAd viewController:self];
nativeAdView = adgNativeAdView;
}
if (nativeAdView) {
// ローテーション時に自動的にViewを削除します
[adgManagerViewController setAutomaticallyRemoveOnReload:nativeAdView];
[self.adView addSubview:nativeAdView];
}
}
- (void)ADGManagerViewControllerFailedToReceiveAd:(ADGManagerViewController *)adgManagerViewController
code:(kADGErrorCode)code {
NSLog(@"Failed to receive an ad.");
// エラー時のリトライは特段の理由がない限り必ず記述するようにしてください。
switch (code) {
case kADGErrorCodeNeedConnection: // ネットワーク不通
case kADGErrorCodeExceedLimit: // エラー多発
case kADGErrorCodeNoAd: // 広告レスポンスなし
break;
default:
[adgManagerViewController loadRequest];
break;
}
}ネイティブ広告デザイン例
- 作成される広告イメージ
- アプリに応じてカスタマイズしてください（画像ロード処理の非同期化など）。
- XIBはサンプルを参考にしてください。 https://github.com/AdGeneration/ADG-iOS-SDK/tree/master/Samples
#import "ADGNativeAdView.h"
#import <ADG/ADGNativeAd.h>
#import <ADG/ADGMediaView.h>
#import <ADG/ADGInformationIconView.h>
@interface ADGNativeAdView()
@property (weak, nonatomic) IBOutlet UIImageView *iconImageView;
@property (weak, nonatomic) IBOutlet UILabel *titleLabel;
@property (weak, nonatomic) IBOutlet UILabel *descriptionLabel;
@property (weak, nonatomic) IBOutlet UIView *mediaViewContainerView;
@property (weak, nonatomic) IBOutlet UILabel *sponsoredLabel;
@property (weak, nonatomic) IBOutlet UILabel *ctaLabel;
@end
@implementation ADGNativeAdView
+ (instancetype)view {
NSString *className = NSStringFromClass([self class]);
return [[[NSBundle mainBundle] loadNibNamed:className
owner:nil
options:0] firstObject];
}
- (void)awakeFromNib {
[super awakeFromNib];
self.layer.borderWidth = 1.0f;
self.layer.borderColor = UIColor.lightGrayColor.CGColor;
self.iconImageView.contentMode = UIViewContentModeScaleAspectFit;
self.iconImageView.clipsToBounds = YES;
self.ctaLabel.backgroundColor = UIColor.whiteColor;
self.ctaLabel.clipsToBounds = YES;
self.ctaLabel.textColor = self.ctaLabel.tintColor;
self.ctaLabel.layer.borderWidth = 1.0f;
self.ctaLabel.layer.borderColor = self.ctaLabel.tintColor.CGColor;
self.ctaLabel.layer.cornerRadius = 5.0f;
}
- (void)apply:(ADGNativeAd *)nativeAd viewController:(UIViewController *)viewController {
if (!nativeAd) {
return;
}
// タイトル
self.titleLabel.text = nativeAd.title ? nativeAd.title.text : @"";
// リード文
self.descriptionLabel.text = nativeAd.desc ? nativeAd.desc.value : @"";
// アイコン画像
if (nativeAd.iconImage.url.length > 0) {
NSURL *iconImageUrl = [NSURL URLWithString:nativeAd.iconImage.url];
NSData *iconImageData = [NSData dataWithContentsOfURL:iconImageUrl];
self.iconImageView.image = [UIImage imageWithData:iconImageData];
}
// メイン画像・動画
for (UIView *v in self.mediaViewContainerView.subviews) {
[v removeFromSuperview];
}
// メイン画像または動画が利用できるかどうかをチェックします。
if (nativeAd.canLoadMedia) {
CGRect mediaViewFrame = CGRectMake(0, 0,
self.mediaViewContainerView.bounds.size.width,
self.mediaViewContainerView.bounds.size.height);
// ADGMediaViewを生成します。
ADGMediaView *mediaView = [[ADGMediaView alloc] initWithFrame:mediaViewFrame];
// 必ずADGNativeAdとUIViewControllerの参照を追加してください。
mediaView.nativeAd = nativeAd;
mediaView.viewController = viewController;
// Viewへ配置します。
[self.mediaViewContainerView addSubview:mediaView];
// メイン画像または動画のロードを開始します。
[mediaView load];
}
// インフォメーションアイコン
ADGInformationIconView *infoIconView = [[ADGInformationIconView alloc] initWithNativeAd:nativeAd];
if (infoIconView) {
[self.mediaViewContainerView addSubview:infoIconView];
[infoIconView updateFrameFromSuperview:UIRectCornerTopRight];
}
// 広告主
self.sponsoredLabel.text = nativeAd.sponsored.value.length > 0 ?
[NSString stringWithFormat:@"sponsored by %@",nativeAd.sponsored.value] :
@"sponsored";
// CTAボタン
NSString *ctaText = nativeAd.ctatext.value.length > 0 ?
nativeAd.ctatext.value : @"詳しくはこちら";
self.ctaLabel.text = ctaText;
// クリックイベント
[nativeAd setTapEvent:self handler:nil];
}
@endv2.8.0から
ADGManagerViewController#delegateViewManagement:は非推奨となりました。 代わりにADGNativeAd#setTapEvent:handlerおよびADGManagerViewController#setAutomaticallyRemoveOnReloadを使用してください。
- 画像は、アスペクト比を変えず、必ず切れることのないようしてください。 万が一、縦横比が正常ではない表示になっている場合、レギュレーションに反してしまう恐れがございます。
- 画像のアスペクト比に関しましては、ADGMediaViewを利用することで正しいアスペクト比を保持して表示がおこなえますので実装例をご参考にしてください。その際は下部に記載の「ADGMediaView注意事項」につきましてもお目通しください。
- 広告破棄のタイミングにて、setAutomaticallyRemoveOnReloadにセットされたUIViewインスタンスに対してremoveFromSuperViewが呼び出されます。
- 広告の破棄は画面のdealloc等、広告の表示が終わるタイミングで行ってください。
- テストではタップの確認も行ってください。
- ADGManagerViewControllerクラスは1つの広告枠に対して1つのインスタンスを生成してください。
- 広告枠の設定によっては各ネイティブ広告オブジェクトのパラメータの値がnilになる場合があります。 例えば、GunosyAdsではCTA取得できません。画像の縦横サイズも含め、すべてがoptionalな値です。画像の縦横サイズも含め、すべてがoptionalな値です。
- PR表記をつける等して広告であることを示してください。 (UIImageViewのcontentModeをScaleAspectFitに設定)
- レスポンスにSponsoredがある場合は表示してください。
- Facebook Audience Networkも併用配信したい場合は、別途SDK連携が必要になります。Facebook Audience Network ネイティブ広告 SDK連携 iOS
※ 2016/12/8(v2.4.2)より必須項目となりました
v2.4.2より、ターゲティングを行っている広告の場合にはデフォルトでインフォメーションアイコン（オプトアウトリンク）が表示されるようになります（ターゲティングを行っていない広告の場合は表示されません）。
インフォメーションアイコンはタップすることで、DSP事業者が指定したオプトアウトWebサイトページへ遷移します。
オプトアウトリンクはユーザーが広告のターゲティングをオプトアウト（拒否）することにより、ユーザーに関する情報の関連付けを防ぐことを可能とし、設置することで配信できるDSP事業者が増加します。
表示される場所は、setTapEvent:nativeAd:handler:で指定したViewの右上に設置されます。
デフォルトの表示位置から変更する場合は、ADGManagerViewController.informationIconViewDefaultを設定し、ADGInformationIconViewを生成してください。
ターゲティングを行っていない広告の場合は、ADGInformationIconViewを生成してもアイコンは表示されません。
インフォメーションアイコンの表示確認は、テストID48635を使用してください。
ADGMediaViewを利用することで、動画広告を配置することができます。
// メイン画像または動画が利用できるかどうかをチェックします。
if (nativeAd.canLoadMedia) {
// ADGMediaViewを生成します。
ADGMediaView *mediaView = [[ADGMediaView alloc]
initWithFrame:CGRectMake(0, 0, width, height)];
// 必ずADGNativeAdとUIViewControllerの参照を追加してください。
mediaView.nativeAd = nativeAd;
mediaView.viewController = viewController;
// Viewへ配置します。
[self.mediaViewContainerView addSubview:mediaView];
// メイン画像または動画のロードを開始します。
[mediaView load];
}- 動画と静止画が利用できる場合は、動画が優先されます。
- 動画や静止画は配信案件によるため、必ずしも配信されるわけではありません。
審査完了前に広告の掲載イメージをご確認頂く際は、以下のIDに置き換えご確認ください。
このIDをセットしたままアプリをリリースしないようご注意ください。
| テストID | 配信広告 |
|---|---|
| 48635 | テスト広告 |