팝업 배너 광고

아래 가이드에서는 팝업 배너 광고를 로드하고, 표시하는 방법을 설명합니다.

기본 요건

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


테스트 광고 게재위치

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

테스트 게재위치 목록

placementCode
설명

SAMPLE_POPUP_BANNER_APP

  • 320x320 이미지 + 애드뱃지

  • 모서리 스타일: 직각

  • 버튼 스타일: 버튼형

  • 버튼 위치: 이미지 하단

  • 좌측 버튼 문구: 오늘 그만보기

  • 우측 버튼 문구: 닫기

어드민의 인벤토리 > 광고상품 > 광고상품 등록 메뉴에서 팝업 배너 광고의 소재 스펙 및 기본 레이아웃을 설정할 수 있습니다.


광고 표시하기

  1. 팝업 광고가 표시되기 원하는 ViewController 에서 NestAdsPopupAdView 를 설정하고 로드합니다.

lazy var popupView: NestAdsPopupAdView!

override func viewDidLoad() {
  // 초기화
  popupView = NestAdsPopupAdView()

  // (선택) 옵션 적용
  popupView.leftButtonOptions = NestAdsPopupLeftButtonOptions(...)
  popupView.rightButtonOptions = NestAdsPopupRightButtonOptions(...)
  // imageOptions의 imageSize를 설정하는 경우, layoutConstraintsOptions 보다 우선하여 적용
  // 둘 다 설정하지 않는 경우, SDK에서 기본 레이아웃을 그려준다.
  popupView.imageOptions = NestAdsPopupImageOptions(...)
  popupView.layoutConstraintsOptions = NestAdsPopupLayoutConstraintsOptions(...)

  // 필수값 적용
  popupView.placementCode = ... //설정하지 않으면 광고 호출에 실패
  popupView.delegate = self

  // 광고 로드
  popupView.load(NestAdsAdRequest(...))

}
  1. 광고 상품별로 왼쪽, 오른쪽 버튼에 들어가는 텍스트가 달라질 수 있기 때문에 왼쪽, 오른쪽 버튼에 기본 동작이 따로 정의되어있지 않습니다. 원하는 동작을 꼭 구현해야 합니다.

extension MyViewController: NestAdsPopupAdViewDelegate {
  ...
  func popupAdViewDidTappedLeftButton(_ popupAdView: NestAdsSDK.NestAdsPopupAdView) {
    // 왼쪽 버튼에 대한 동작을 이 메서드에서 구현한다.
    handleDoNotShowToday() // "오늘 그만 보기" 구현
    popupView.dismiss() // 팝업 광고를 화면에서 제거한다.
  }
  func popupAdViewDidTappedRightButton(_ popupAdView: NestAdsSDK.NestAdsPopupAdView) {
    // 오른쪽 버튼에 대한 동작을 이 메서드에서 구현한다.
    //"닫기" 구현
    popupView.dismiss() // 팝업 광고를 화면에서 제거한다.
  }
  ...
}
  1. 광고 로드 후 원하는 시점에 .show() 를 호출해 광고를 표시합니다. 직접 NestAdsPopupAdView의 레이아웃을 설정 하지 않도록 주의하세요.

extension MyViewController: NestAdsPopupAdViewDelegate {
  ...
   func popupAdViewDidReceiveAd(_ popupAdView: NestAdsSDK.NestAdsPopupAdView) {
    self.popupView = popupAdView
    popupView.show() // 팝업 광고를 화면에 노출시킨다.
  }
  ...
}
  1. 원하는 시점에 .dismiss() 를 호출해 팝업을 닫습니다. 직접 NestAdsPopupAdView의 레이아웃을 설정 하지 않도록 주의하세요.

extension MyViewController: NestAdsPopupAdViewDelegate {
  ...
  func popupAdViewDidTappedRightButton(_ popupAdView: NestAdsSDK.NestAdsPopupAdView) {
    popupView.dismiss() // 팝업 광고를 화면에서 제거한다.
  }
  ...
}

오늘 그만보기 구현 예시

// 오늘 그만보기: 클릭한 시점부터 당일 자정(00:00)까지 해당 광고 팝업 노출되지 않도록 구현한 예시
// UserDefaults에 해당 시점을 저장하고 popupView.show()를 호출하기 전 이를 체크한다.
// '오늘 그만보기' 설정 확인 후, popupView.show 호출
private func handlePopupShow() {
    if checkUserDidSelectDoNotShowPopupAdToday() {
      // '오늘 그만 보기' 설정된 경우
      // ..
    } else {
      popupView.show(in: self) // 설정되지 않은 경우, 팝업 광고를 화면에 띄운다.
    }
}
private func checkUserDidSelectDoNotShowPopupAdToday() -> Bool {
    if let savedSkipDate = UserDefaults.standard.string(forKey: "NestAdsPopupSkipDateKey") {
      let currentDate = getCurrentDateWithoutTime()
      if savedSkipDate == currentDate {
        return true
      }
    }
    return false
}
private func handleDoNotShowToday() {
    let currentDate = getCurrentDateWithoutTime()
    UserDefaults.standard.set(currentDate, forKey: "NestAdsPopupSkipDateKey")
}
private func getCurrentDateWithoutTime() -> String {
    let date = Date()
    let formatter = DateFormatter()
    formatter.dateFormat = "yyyy-MM-dd"
    return formatter.string(from: date)
}

// NestAdsPopupAdViewDelegate 메서드
func popupAdViewDidReceiveAd(_ popupAdView: NestAdsSDK.NestAdsPopupAdView) {
    self.popupView = popupAdView
    handlePopupShow() //광고 로드가 완료되면 팝업을 연다. (혹은 광고 자체를 로드하지 않도록 구현)
}
func popupAdViewDidTappedLeftButton(_ popupAdView: NestAdsSDK.NestAdsPopupAdView) {
    // 오늘 그만 보기 구현
    handleDoNotShowToday()
    popupView.dismiss() // 팝업 광고를 화면에서 제거한다.
}

닫기 구현 예시

popupView.dismiss()

광고 delegate

NestAdsPopupAdView 에서 지원하는 delegate는 다음을 참고하세요.

Last updated