Native_Ad_iOS

iOS SDK ネイティブ広告

はじめに

開発環境にXcodeを使用することを前提とします。

対応バージョン

iOS 7.0以降

導入の流れ

SDKをダウンロードします
↓
例を参考に広告表示の実装を行います

1. SDKをダウンロードする

iOS SDK Getting Started / バナー広告からご確認ください。

2. 広告表示を実装する

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)mediationNativeAd

mediationNativeAdからネイティブ広告オブジェクトが取得できます。
ネイティブ広告オブジェクトは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 *mediaView = [[ADGMediaView alloc] initWithFrame:mediaViewFrame];
        mediaView.nativeAd = nativeAd;
        mediaView.viewController = viewController;
        [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];
}

@end

注意事項

v2.8.0から ADGManagerViewController#delegateViewManagement:は非推奨となりました。代わりに ADGNativeAd#setTapEvent:handler および ADGManagerViewController#setAutomaticallyRemoveOnReload を使用してください。

広告破棄のタイミングにて、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を生成してもアイコンは表示されません。

動画広告の実装について(iOS: v2.9.0~ (ADG.framework))

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

ADGMediaView注意事項

動画と静止画が利用できる場合は、動画が優先されます。
動画や静止画は配信案件によるため、必ずしも配信されるわけではありません。

テスト用ID

テスト広告の表示に使用するAd Genrationの広告枠IDです。
このIDをセットしたままアプリをリリースしないようご注意ください。

ID	説明
48635	RTB/Gunosy/自社広告のテスト広告

サービス・運用FAQ / お問い合わせ

Home

導入マニュアルのドキュメントはコチラに移行しました。

お手数ですがリンクから遷移してください。 https://docs.sdk.ad-generation.jp/

Provide feedback

Saved searches

Use saved searches to filter your results more quickly