커스텀형 광고

아래 가이드에서는 커스텀형 광고를 로드하고, 표시하고, 성과 수집 하는 방법을 설명합니다.

기본 요건

시작 가이드에 따라 필요한 과정을 완료합니다.


테스트 광고 게재위치

Placement Code(게재위치 코드)는 어드민의 인벤토리 > 게재위치 메뉴에서 게재위치를 등록 시 시스템을 통해 자동으로 생성됩니다.

테스트 게재위치 목록

placementCode
creativeSpecId
설명

SAMPLE_CUSTOM_EXPANDABLE_BANNER

40000001

단일 광고 요청용 게재위치

SAMPLE_MULTIPLE_IMAGE_BANNER

10000002

10000003

10000004

다중 광고 요청용 게재위치


광고 로드하기

커스텀형 광고는 NestAdsAdLoader 클래스로 로드되며, 이 클래스는 NestAdsAdLoaderDelegate 프로토콜에 따라 delegates에게 정보를 전송합니다.

NestAdsAdLoader 초기화하기

광고를 로드하려면 먼저 광고 로더를 초기화 해야합니다. 다음 코드는 NestAdsAdLoader 를 초기화하는 방법을 보여줍니다.

adLoader = NestAdsAdLoader(
        placementCode: "SAMPLE_CUSTOM_EXPANDABLE_BANNER",
        rootViewController: self,
        adTypes: [.customNative],
        options: [... ad loader options objects ...]
      )
adLoader.delegate = self

광고를 로드하려는 게재위치 코드, 광고를 게재하는 곳의 UIViewController, 광고 형식, 광고 표시 옵션을 넣어서 광고 로더를 초기화합니다.

NestAdsAdLoader의 자세한 내용은 데이터 모델 NestAdsAdLoader 섹션에서 확인해주세요.

광고 로드 프로토콜 메서드

커스텀형 광고를 로드하는 프로토콜에는 두 가지 메서드가 있습니다.

  • 첫 번째는 NestAdsAdLoader에서 사용해야 하는 소재 스펙 ID를 넣어 반환 하는 메서드입니다. 소재 스펙 ID 를 넣어주면 해당하는 스펙의 광고만 요청할 수 있습니다.

func customNativeCreativeSpecIDs(for adLoader: NestAdsAdLoader) -> [String]
  • 두 번째는 광고가 로드될 때 그 응답 객체와 함께 호출 되는 메서드입니다.

func adLoader(
_ adLoader: NestAdsAdLoader,
didReceive customNativeAd: NestAdsCustomNativeAd)

소재 스펙 ID

커스텀형 광고 형식을 식별하는 데 사용되는 소재 스펙 ID는 어드민의 인벤토리 > 소재스펙 메뉴에서 확인할 수 있습니다. 소재 스펙 ID는 소재 스펙 등록 시 시스템을 통해 자동으로 생성됩니다.

소재 스펙 메뉴에서 소재 스펙을 등록 시 미디어 스펙을 자유롭게 구성할 수 있습니다.

스펙 ID는 커스텀형 광고를 표시할 때 각 미디어 스펙의 데이터를 가져오는 데 사용되는 식별자입니다.

VIDEO 미디어 스펙은 ID가 지정되어 있습니다.


광고 요청하기

단일 광고 요청

NestAdsAdLoader를 생성한 후에 load 메서드를 호출하여 광고를 요청합니다.

adLoader.load(NestAdsAdRequest())

NestAdsAdRequest 의 자세한 내용은 NestAdsAdRequest 섹션에서 확인해주세요.

다중 광고 요청

NestAdsMultipleAdsAdLoaderOptions.numberOfAds 를 설정하고 load 메서드를 호출하여 광고를 요청합니다.

let multipleOptions = NestAdsMultipleAdsAdLoaderOptions()
multipleOptions.numberOfAds = 2

adLoader = NestAdsAdLoader(
        placementCode: "SAMPLE_CUSTOM_EXPANDABLE_BANNER",
        rootViewController: self,
        adTypes: [.customNative],
        options: [multipleOptions]
)
adLoader.load(NestAdsAdRequest())

광고 로드 완료 시점 확인하기

앱이 load()를 호출한 후 다음 호출을 사용하여 요청 결과를 가져올 수 있습니다.

각 delegate의 메소드에서 성공과 실패한 경우에 처리를 합니다.

성공한 요청 처리

  • NestAdsCustomNativeAdLoaderDelegateadLoader(_ adLoader: NestAdsAdLoader, didReceive customNativeAd: NestAdsCustomNativeAd)

실패한 요청 처리

  • NestAdsAdLoaderDelegateadLoader(_ adLoader: NestAdsAdLoader, didFailToReceiveAdWithError error: NestAdsAdError)

자세한 내용은 NestAdsAdLoaderDelegate, NestAdsCustomNativeAdLoaderDelegate 섹션에서 확인해주세요.

func adDidLoadedFail(
    _ adLoader: NestAdsAdLoader,
    didFailToReceiveAdWithError error: NestAdsAdError)

광고 표시하기

NestAdsCustomNativeAd 클래스는 미디어 스펙 ID를 파라미터로 사용하는 image(forKey: String), string(forKey: String) 등의 메서드를 제공합니다.

NestAdsCustomNativeAd와 함께 사용하는 전용 광고 뷰 클래스는 없습니다. 따라서 사용자 환경에 적합한 모든 레이아웃을 자유롭게 사용할 수 있습니다.

다음은 커스텀형 광고를 표시하는 간단한 예시입니다.

...
func populateWithCustomNativeAd(_ customNativeAd: NestAdsCustomNativeAd) {
  self.customNativeAd = customNativeAd

  // TEXT 타입의 "AdText"란 미디어 스펙 ID 가져와서 세팅
  adTextView.text = customNativeAd.string(withMediaSpecID: "AdText")
  //IMAGE 타입의 "PreviewImage" 란 미디어 스펙 ID 가져와서 세팅
  mainImageView.image = customNativeAd.image(withMediaSpecID: "PreviewImage")?.image
}
...

동영상 미디어 스펙

소재 스펙을 만들 때 동영상을 추가할 수 있습니다.

NestAdsAdLoaderDelegatedidReceive 를 통해 customNativeAd가 들어오면 customNativeAd.mediaContent 속성을 사용하여 미디어 콘텐츠를 가져올 수 있습니다.

그런 다음 NestAdsMediaView를 생성하고, mediaContent에 그 값을 설정합니다.

응답 받은 광고에 동영상이 없는 경우엔 그에 대처하여 코드를 작성해야 합니다.

extension ViewController: NestAdsCustomNativeAdLoaderDelegate {

  func adLoader(
    _ adLoader: NestAdsAdLoader,
    didReceive customNativeAd: NestAdsCustomNativeAd) {

    // native ad view 생성
    let customNativeAdView = ...
    let hasVideoContent = customNativeAd.mediaContent.hasVideoContent
    if hasVideoContent {
      customNativeAd.mediaContent.videoController.delegate = self
    }
    customNativeAdView.populate(withCustomNativeAd: customNativeAd)
  }
}

class MySimpleNativeAdView: UIView {
  func populate(withCustomNativeAd customNativeAd: NestAdsCustomNativeAd) {
    let mainView: UIView = self.mainView(forCustomNativeAd: customNativeAd)
    updateMainView(mainView)
  }

  private func mainView(forCustomNativeAd customNativeAd: NestAdsCustomNativeAd) -> UIView {
    if customNativeAd.mediaContent.hasVideoContent {
      let mediaView = NestAdsMediaView()
      mediaView.mediaContent = customNativeAd.mediaContent
      return mediaView
    } else {
      let image: UIImage? = customNativeAd.image(withMediaSpecID: "PreviewImage")?.image
      return UIImageView(image: image) }
    }
  }

  private func updateMainView(_ mainView: UIView) {
    for subview: UIView in mainPlaceholder.subviews {
      subview.removeFromSuperview()
    }
    mainPlaceholder.addSubview(mainView)
    mainView.translatesAutoresizingMaskIntoConstraints = false
    let viewDictionary: [AnyHashable: Any] = ["PreviewImage":mainView]
    mainPlaceholder.addConstraints(NSLayoutConstraint.constraints(
      withVisualFormat: "H:|[mainView]|", options: [], metrics: nil,
      views: viewDictionary as? [String : Any] ?? [String : Any]()))
    mainPlaceholder.addConstraints(NSLayoutConstraint.constraints(
      withVisualFormat: "V:|[mainView]|", options: [], metrics: nil,
      views: viewDictionary as? [String : Any] ?? [String : Any]()))
  }
}

동영상 광고의 라이프 사이클에 따라 NestAdsVideoController 의 Delegate 를 등록할 수 있습니다.

자세한 내용은 NestAdsVideoControllerDelegate 섹션을 참조하세요.

extension CustomExampleViewController: NestAdsVideoControllerDelegate {
  func videoControllerDidPlayVideo() {
   //동영상 재생 처리
  }
  func videoControllerDidPauseVideo() {
  //동영상 일시정지 처리
  }
  ...
}

성과 수집

어드민에서 각 성과와 미디어 스펙을 매핑할 수 있습니다. 해당 미디어 스펙의 뷰가 노출되거나 클릭되면 SDK로 성과를 전달해야 합니다.

노출수

성과필드 매핑 > 노출수와 매핑된 미디어 스펙의 뷰가 노출되면 NestAdsCustomNativeAd 에서 recordImpression 메서드를 호출합니다.

customNativeAd.recordImpression();

클릭수 및 행동유도 클릭수

성과필드 매핑 > 클릭수/행동유도 클릭수와 매핑된 미디어 스펙의 뷰가 클릭되면 NestAdsCustomNativeAd 에서 performClick 메서드를 호출하고 클릭한 미디어 스펙의 ID를 전달합니다.

예를 들어 'PreviewImage'라는 미디어 스펙이 있고 이 미디어 스펙에 해당하는 UIImageView 클릭을 보고하려는 경우 코드는 다음과 같습니다.

customNativeAd.performClick(withMediaSpecID:"PreviewImage")

performClick 을 호출하면 다음의 일을 수행합니다.

  1. 해당 미디어 스펙의 클릭 성과 수집

  2. NestAdsCustomNativeAdcustomClickHandler 을 등록한 경우 해당 함수 호출

  3. customClickHandler 을 등록하지 않은 경우, 해당 미디어 스펙에 랜딩 URL 이 등록되어 있으면 해당 URL 오픈

각 성과 수집에는 NestAds 자체 트래킹 및 외부 트래킹 내용이 모두 포함되어 있습니다.

Last updated