> ## Documentation Index
> Fetch the complete documentation index at: https://guide.daro.so/llms.txt
> Use this file to discover all available pages before exploring further.

# 배너 & MREC 광고

> DARO를 통해 배너와 MREC 광고를 구현하는 방법을 알아봅니다.

<Note>
  [SDK 초기화](/ko/sdk-integration-v2/ios_new/get-started#sdk-초기화하기)가 성공한 뒤 광고를 로드하세요. Swift 예제는 `import Daro`가 필요하며, Objective-C 예제는 `DaroObjCBridge`를 사용합니다. 기존 연동은 [마이그레이션 가이드](/ko/sdk-integration-v2/ios_new/migration-guide)를 먼저 확인하세요.
</Note>

## 배너 & MREC 형태 소개

### 배너 광고

* 앱 레이아웃의 일부를 차지하는 직사각형 광고 형태로 보편적으로 사용됩니다.
* 대부분의 광고 디맨드들이 지원하는 형태인 320x50 사이즈를 사용합니다.

<img src="https://mintcdn.com/delightroom-5a71a6a8/j3-znW7LKrbpP3mb/sdk-integration/common-img/ad-formats/banner-example.png?fit=max&auto=format&n=j3-znW7LKrbpP3mb&q=85&s=d00b59bcc639852f56ead46315f574a5" alt="Banner Example Pn" title="Banner Example Pn" style={{ width:"37%" }} width="998" height="2160" data-path="sdk-integration/common-img/ad-formats/banner-example.png" />

### MREC 광고

* 300x250 의 사이즈를 MREC으로 구분하여 부릅니다.
* 전반적으로 배너와 동일한 특성을 가집니다.

<img src="https://mintcdn.com/delightroom-5a71a6a8/dxU0bpsPoPvkYh_g/sdk-integration/common-img/ad-formats/mrec-example.png?fit=max&auto=format&n=dxU0bpsPoPvkYh_g&q=85&s=6e43a92f3517134aba67f81f874cd36e" alt="Mrec Example Pn" title="Mrec Example Pn" style={{ width:"38%" }} width="998" height="2160" data-path="sdk-integration/common-img/ad-formats/mrec-example.png" />

***

## 애드유닛 설정

대시보드에서 발급받은 Ad Unit Key를 사용하여 애드유닛을 설정하세요.

<Tabs>
  <Tab title="Swift">
    ```swift theme={null}
    let bannerUnit = DaroAdUnit(unitId: "your_banner_unit_id")
    let mrecUnit = DaroAdUnit(unitId: "your_mrec_unit_id")
    ```
  </Tab>

  <Tab title="Objective-C">
    ```objc theme={null}
    // Objective-C에서는 DaroAdUnit을 별도로 생성하지 않고
    // 초기화 시 unitId를 직접 전달합니다
    NSString *bannerUnitId = @"your_banner_unit_id";
    NSString *mrecUnitId = @"your_mrec_unit_id";
    ```
  </Tab>
</Tabs>

## 광고 구현

### 기본 사용법

<Tabs>
  <Tab title="Swift">
    ```swift theme={null}
    // 배너 광고
    let bannerView = DaroAdBannerView(
        unit: bannerUnit,
        bannerSize: .banner,
        autoLoad: false
    )
    // MREC 광고
    let mrecView = DaroAdBannerView(
        unit: mrecUnit,
        bannerSize: .MREC,
        autoLoad: false
    )
    ```
  </Tab>

  <Tab title="Objective-C">
    ```objc theme={null}
    // 배너 광고
    DaroObjCBannerView *bannerView = [[DaroObjCBannerView alloc]
        initWithUnitId:bannerUnitId
        bannerSize:DaroObjCBannerSizeBanner
        autoLoad:NO];

    // MREC 광고
    DaroObjCBannerView *mrecView = [[DaroObjCBannerView alloc]
        initWithUnitId:mrecUnitId
        bannerSize:DaroObjCBannerSizeMrec
        autoLoad:NO];
    ```
  </Tab>
</Tabs>

> **Note**: 예제는 `autoLoad: false`로 뷰를 생성합니다. SDK 초기화 완료 후 리스너/델리게이트와 뷰 설정을 마치고 `loadAd()`를 호출하세요. 이후 새로고침은 SDK가 관리합니다.

MREC도 같은 순서로 설정한 뒤 Swift에서는 `mrecView.loadAd()`, Objective-C에서는 `[mrecView loadAd]`를 호출하세요.

### 리스너/델리게이트 설정

<Tabs>
  <Tab title="Swift (Listener)">
    광고의 상태 변화를 모니터링하기 위해 리스너를 설정할 수 있습니다.

    ```swift theme={null}
    bannerView.listener.onAdLoadSuccess = { ad, adInfo in
        print("[DARO] Listener Banner Ad loaded: \(ad) \(adInfo)")
    }
    bannerView.listener.onAdLoadFail = { error in
        print("[DARO] Listener Banner Ad failed: \(error)")
    }
    bannerView.listener.onAdClicked = { adInfo in
        print("[DARO] Listener Banner Ad clicked: \(adInfo)")
    }
    bannerView.listener.onAdImpression = { adInfo in
        print("[DARO] Listener Banner Ad impression: \(adInfo)")
    }

    bannerView.loadAd()
    ```
  </Tab>

  <Tab title="Objective-C (Delegate)">
    광고의 상태 변화를 모니터링하기 위해 델리게이트를 설정할 수 있습니다.

    **1. 헤더 파일에서 델리게이트 프로토콜 채택:**

    ```objc theme={null}
    @interface YourViewController () <DaroObjCBannerViewDelegate>
    @property (nonatomic, strong) DaroObjCBannerView *bannerView;
    @end
    ```

    **2. 델리게이트 설정:**

    ```objc theme={null}
    // 델리게이트 설정
    self.bannerView.delegate = self;

    // 뷰 계층에 추가
    [self.view addSubview:self.bannerView];
    [self.bannerView loadAd];
    ```

    **3. 델리게이트 메서드 구현:**

    ```objc theme={null}
    #pragma mark - DaroObjCBannerViewDelegate

    - (void)bannerViewDidLoad:(DaroObjCBannerView *)bannerView
                       adInfo:(DaroObjCAdInfo *)adInfo {
        NSLog(@"[DARO] Banner loaded - Unit: %@", adInfo.adUnitId);
    }

    - (void)bannerView:(DaroObjCBannerView *)bannerView
        didFailWithError:(NSError *)error {
        NSLog(@"[DARO] Failed to load: %@", error.localizedDescription);
    }

    - (void)bannerViewDidClick:(DaroObjCBannerView *)bannerView
                        adInfo:(DaroObjCAdInfo *)adInfo {
        NSLog(@"[DARO] Banner clicked");
    }

    - (void)bannerViewDidRecordImpression:(DaroObjCBannerView *)bannerView
                                   adInfo:(DaroObjCAdInfo *)adInfo {
        NSLog(@"[DARO] Banner impression recorded");
    }
    ```
  </Tab>
</Tabs>