본문으로 건너뛰기

네이티브 일반형 가이드

NAMSDK Import​

SDK 모듈을 import 합니다.

@import GFPSDK;

네이티브 광고 제공자 초기화​

연동할 네이티브 광고 제공자의 Pod이 프로젝트에 추가된 상태에서 GFPAdManager를 통해 초기화 합니다. (앱이 구동되는 시점에 한번만 수행)

Provider OptionAd Provider
GFPNativeProviderOptionNDA네이버 GFP 네이티브 광고
GFPNativeProviderOptionDFP구글 DFP 네이티브 광고
GFPNativeProviderOptionFAN페이스북 FAN 네이티브 광고
GFPNativeProviderOptionInMobi인모비 네이티브 광고
// DFP, NDA, Inmobi, Facebook 광고를 연동하려는 경우 cocoapods 의존성 추가.
[GFPAdManager setupWithPublisherCd:@"publisherCd" completionHandler:^(GFPError * _Nullable error) {
    NSLog(@"Setup ERROR: %@", error);
}];

뷰 컨트롤러 작성​

뷰 컨트롤러(MyViewController)를 만들고, 헤더파일(MyViewController.h)에 아래 작업을 수행합니다.
(이 예제에서는 하나의 뷰 컨트롤러가 모든 이벤트 프로토콜을 구현합니다.)

  1. 뷰 컨트롤러에 GFPAdLoader *adLoader 프로퍼티를 선언합니다.
  2. 뷰 컨트롤러에 GFPAdLoaderDelegate 프로토콜을 구현합니다.
  3. 뷰 컨트롤러에 GFPNativeAd *nativeAd 프로퍼티를 선언합니다.
  4. 뷰 컨트롤러에 GFPNativeAdDelegate 프로토콜을 구현합니다.

GFPAdLoaderDelegate는 네이티브 (및 배너) 광고 로드 관련 이벤트를, GFPNativeAdDelegate 로드된 네이티브 객체의 노출, 클릭, 렌더링 에러등의 이벤트를 전달합니다.

// MyViewController.h

@import GFPSDK;

@interface MyViewController : UIViewController <GFPAdLoaderDelegate, GFPNativeAdDelegate>

@property (nonatomic) GFPAdLoader *adLoader;

@property (nonatomic) GFPNativeAd *nativeAd;
@property (nonatomic) GFPNativeAdView *nativeAdView;

@end

GFPAdLoader 생성 및 광고 요청​

MyViewController.m의 viewDidLoad 메소드에서 GFPAdLoader의 인스턴스를 생성하고, 광고를 요청합니다.

  • GFPAdLoader 인스턴스를 생성할 때, 발급받으신 광고유닛 ID와 함께, GFPAdParam 에서 사용자 정보를 세팅해주세요. GFPAdParam은 광고 효과를 높이기 위한 타게팅에 사용됩니다.
- (void)viewDidLoad {
    [super viewDidLoad];

    GFPAdParam *adParam = [[GFPAdParam alloc]init];
    adParam.yearOfBirth = 1990;
    adParam.gender = GFPAdParamGenderTypeMale;
    ...

    self.adLoader = [[GFPAdLoader alloc] initWithUnitID:self.unitID
                                             rootViewController:self
                                                        adParam:adParam];
        
    GFPAdNativeOptions *nativeOptions = [[GFPAdNativeOptions alloc] init];
    nativeOptions.renderingSetting = ...; // 로드될 네이티브 일반형 광고 렌더링 설정
    [self.adLoader setNativeDelegate:self nativeOptions:nativeOptions];
    
    // 광고 요청
    self.adLoader.delegate = self;
    [self.adLoader loadAd];
}
팁

광고 요청 성공 시 GFPAdLoaderDelegate의 adLoader:didReceiveNativeAd: 메소드가 호출됩니다.

추가 설정 가능 요소들​

광고 요청 타임아웃 (기본값 60초)​

광고요청 이후 지정한 시간(초)경과 까지 광고 응답을 얻지 못하면 기존 요청이 무효화되며, GFPAdLoaderDelegate의 adLoader:didFailWithError:responseInfo: 메소드가 호출됩니다.

self.adLoader.requestTimeoutInterval = ...

GFPNativeAdRenderingSetting​

DFP adChoicesView 위치 설정 옵션​

DFP의 adChoiceView는 오버레이 형식으로 렌더링 됩니다. 따라서, adChoicesView가 자동으로 삽입될 네 귀퉁이중 한군데를 비워놓아야 합니다. DFP의 adChoicesView의 기본 위치는 오른쪽 상단 코너이며,
GFPNativeAdRenderingSetting의 preferredAdChoicesViewPosition 을 통해 설정 가능합니다.

GFPNativeAdRenderingSetting *setting = [GFPNativeAdRenderingSetting alloc] init];
setting.preferredAdChoicesViewPosition = GFPAdChoicesViewPositionTopRightCorner;

GFPAdNativeOptions *nativeOptions = [[GFPAdNativeOptions alloc] init];
nativeOptions.renderingSetting = setting;
정보

구글 문서에는 adChoiceView를 직접 등록하면 오버레이형식이 아닌 직접 등록한 뷰에 그려진다고 되어있으나, 아직까지 정상 동작 하지 않으므로 우상단이 아닌 위치에 adChoiceView가 렌더링 되기를 원하시는 경우 이 세팅이 필요합니다.

미디어뷰가 없는 네이티브 광고 사용시​

미디어뷰가 없는 네이티브 광고(예를들어 아이콘과 타이틀 클릭 버튼만으로 구성된 네이티브 광고)를 사용하려면, GFPNativeAdRenderingSetting 의 hasMediaView = NO를 설정해야 합니다. (기본값은 YES)

위험

네이티브 뷰에 미디어 뷰 존재여부와 GFPNativeAdRenderingSetting.hasMediaView 상태가 다르면, 네이티브 광고 렌더링 시점에 오류가 발생합니다.

GFPNativeAdRenderingSetting *setting = [GFPNativeAdRenderingSetting alloc] init];
setting.hasMediaView = NO;

GFPAdNativeOptions *nativeOptions = [[GFPAdNativeOptions alloc] init];
nativeOptions.renderingSetting = setting;

GFPContentInfo​

NativeNormal 타입 광고를 Communication Ad 으로 적용할 경우, ContentInfo 를 주입해야합니다.

GFPContentInfo *contentInfo = [[GFPContentInfo alloc] initWithSourceType:@"0001" subtype:@"menu" sourceId:@"30907206:7"];
adParam.contentInfo = contentInfo;

GFPAdLoaderDelegate​

GFPAdLoaderDelegate를 구현하시면, 해당 메서드를 통해 광고 로드 관련 이벤트를 받으실 수 있습니다.

로드 성공시​

네이티브 광고 로드가 성공하면, GFPNativeAd 객체가 응답값으로 넘어옵니다.
GFPNativeAd객체를 이용하여 네이티브 광고 뷰(UIView)를 생성하게 됩니다. GFPNativeAd객체를 이용하여 네이티브 광고 뷰를 구성하는 방법은 네이티브 광고 뷰 생성를 확인해주세요.

- (void)adLoader:(GFPAdLoader *)unifiedAdLoader didReceiveNativeAd:(GFPNativeAd *)nativeAd {
      // nativeAd 객체를 이용하여 광고 뷰 생성
      ...
}

로드 실패시​

- (void)adLoader:(GFPAdLoader *)unifiedAdLoader didFailWithError:(GFPError *)error responseInfo:(GFPLoadResponseInfo *)responseInfo {
    ...
}

네이티브 광고 렌더링​

GFPNativeAd가 성공적으로 로드되면, 네이티브 광고를 렌더링할 수 있습니다.
이를 위해서는 네이티브 광고의 요소가 정의된 뷰 객체가 필요하며, 이 객체는 GFPNativeAdView 클래스를 상속해야 합니다. 이 문서에서는 인터페이스 빌더를 사용하여 뷰를 구성합니다.

네이티브 광고 뷰 생성​

  1. 네이티브 광고용 뷰(xib)를 만들고, Xcode 의 Identity Inspector 탭에서 Custom Class를 GFPNativeAdView 로 설정합니다. 예시이미지

  2. 네이티브 광고 뷰를 구성하는 각 에셋 뷰(title, body 등등)를 만들고, Connections Inspector 탭에서 GFPNativeAdView의 해당 Outlet과 연결합니다.

  • 광고의 동영상 또는 이미지를 표시하는 데 사용되는 mediaView도 Custom Class를 GFPMedaiView로 설정해주어야 합니다. 예시이미지
  1. 네이티브 광고 로드이후 아래와 같은 형태로 구현이 가능합니다.
// selt.nativeAdView 는 GFPNativeAdView 객체임

- (void)adLoader:(GFPAdLoader *)unifiedAdLoader didReceiveNativeAd:(GFPNativeAd *)nativeAd {

    // 네이티브 광고객체 및 delegate 등록
    self.nativeAd = nativeAd;
    self.nativeAd.delegate = self;
    
    // 네이티브 광고 에셋 설정
    self.nativeAdView.titleLabel.text = nativeAd.title;
    self.nativeAdView.bodyLabel.text = nativeAd.body;
    self.nativeAdView.advertiserLabel.text = nativeAd.advertiser;
    selt.nativeAdView.callToActionLabel.text = nativeAd.callToAction;
    ...
    
    // 뷰 객체에 네이티브 광고를 세팅하면, iconView, mediaView 렌더링 및 뷰 트래킹이 시작됨. 
    self.nativeAdView.nativeAd = nativeAd;
    
    // subview 등록
    [self.view addSubView:self.nativeAdView]
}

GFPNativeAdDelegate​

네이티브 광고가 노출, 클릭 되었을때 이벤트가 전달 됩니다.

광고 노출 이벤트 발생시​

- (void)nativeAdWasSeen:(GFPNativeAd *)nativeAd {
    ...
}

클릭 이벤트 발생시​

- (void)nativeAdWasClicked:(GFPNativeAd *)nativeAd {
    ...
}

렌더링 에러 발생시​

- (void)nativeAd:(GFPNativeAd *)nativeAd didFailWithError:(GFPError *)error {
    ...
}

광고가 사용자에 의해 Mute 되었을 때​

광고가 Mute 되었을 때, 서비스에 콜백을 통해 Mute 를 알립니다. Mute 후 NAMSDK에서는 "이 광고는 더 이상 보이지 않습니다." 라는 화면을 노출하고 있으며, 서비스의 정책에 따라 광고를 화면에서 없앨 지/그대로 노출할 지를 정합니다.

- (void)nativeAdWasMuted:(GFPNativeAd *)nativeAd {

}

기타​

직접 광고 제공자의 네이티브 광고 객체를 사용하여 네이티브 광고 렌더링​

GFPNativeAd 객체는 네이티브 광고 제공자로부터 얻은 원본 네이티브 객체를 가지고 있으며, GFPNativeAd 객체의 adProviderNativeAd 필드를 통해 접근이 가능합니다.

또한, GFPNativeAd 객체의 adProviderType에 따라 현재 로드된 네이티브 광고가 어떤 광고 제공자의 것인지 알 수 있습니다. 따라서 adProviderType에 따라 adProviderNativeAd 객체를 해당 광고 제공자의 네이티브 객체로 업 캐스팅하면, 각 광고 제공자의 원본 네이티브 객체에 접근이 가능합니다.

최종적으로 이 원본 네이티브 객체를 가지고 각 광고 제공자의 가이드에 따라 네이티브 광고 뷰를 구성하게 됩니다.

@import FBAudienceNetwork;    // FAN SDK
@import GoogleMobileAds;      // DFP SDK

- (void)adLoader:(GFPAdLoader *)unifiedAdLoader didReceiveNativeAd:(GFPNativeAd *)nativeAd {

    // 네이티브 광고객체 및 delegate 등록
    self.nativeAd = nativeAd;
    self.nativeAd.delegate = self;

    if (_nativeAd.adProviderType == GFPNativeAdProviderTypeFAN) {
        // FAN 네이티브 인 경우
        ...


    } else if (gfpNativeAd.adProviderType == GFPNativeAdProviderTypeDFP) {
        // DFP 네이티브 인 경우
        ...
    }

}

광고제공자별 네이티브 광고 제작 가이드​