iOS에서의 배너 광고 연동
모바일 배너 광고는 일반적으로 화면 상단이나 하단에 표시되는 광고이며, 사용자 세션 이 지속되는 동안 화면에 고정 표시됩니다. 배너 광고는 구현하기 쉽고 광고주 인지도를 끌어올리는데에 훌륭한 도구이기 때문에 모바일 앱에서 매우 인기있는 광고 유닛입니다.
아이언소스는 시스템에서 자동으로 시작되는 4가지 타입의 정적 또는 동적 배너를 지원합니다.
Note! 6.15.0 버전 부터는 아이언소스 SDK에서 Safe Area 솔루션이 제공되지 않습니다. 만약 6.15.0 미만의 버전에서 아이언소스 배너 솔루션을 사용중이시고 SDK 버전을 업그레이드 하실 예정이라면 반드시 이 단계들을 따라 진행해 주시기 바랍니다.
1단계. 대리자(Delegate) 구현하기
아이언소스 SDK는 배너동작에 대한 정보 전달을 위해 여러가지 대리자(Delegate) 메서드를 호출합니다. 아이언소스 SDK는 아래의 목록에 나열된 이벤트들의 정보를 대리자 메서드들에 전달합니다:
+ (void)setLevelPlayBannerDelegate:(nullable id<LevelPlayBannerDelegate>)delegate;
#pragma mark - LevelPlayBannerDelegate
/**
Called after each banner ad has been successfully loaded, either a manual load or banner refresh
@param adInfo The info of the ad.
*/
- (void)didLoad:(ISBannerView *)bannerView withAdInfo:(ISAdInfo *)adInfo{
}
/**
Called after a banner has attempted to load an ad but failed.
This delegate will be sent both for manual load and refreshed banner failures.
@param error The reason for the error
*/
- (void)didFailToLoadWithError:(NSError *)error{
}
/**
Called after a banner has been clicked.
@param adInfo The info of the ad.
*/
- (void)didClickWithAdInfo:(ISAdInfo *)adInfo{
}
/**
Called when a user was taken out of the application context.
@param adInfo The info of the ad.
*/
- (void)didLeaveApplicationWithAdInfo:(ISAdInfo *)adInfo{
}
/**
Called when a banner presented a full screen content.
@param adInfo The info of the ad.
*/
- (void)didPresentScreenWithAdInfo:(ISAdInfo *)adInfo{
}
/**
Called after a full screen content has been dismissed.
@param adInfo The info of the ad.
*/
- (void)didDismissScreenWithAdInfo:(ISAdInfo *)adInfo{
}
IronSource.setLevelPlayBannerDelegate(delegate: LevelPlayBannerDelegate?)
//MARK: LevelPlayBannerDelegate
/**
Called after each banner ad has been successfully loaded, either a manual load or banner refresh
@param bannerView View object that contains banner
@param adInfo The info of the ad.
*/
func didLoad(_ bannerView: ISBannerView!, with adInfo: ISAdInfo!) {
}
/**
Called after a banner has attempted to load an ad but failed.
This delegate will be sent both for manual load and refreshed banner failures.
@param error The reason for the error
*/
func didFailToLoadWithError(_ error: Error!) {
}
/**
Called after a banner has been clicked.
@param adInfo The info of the ad.
*/
func didClick(with adInfo: ISAdInfo!) {
}
/**
Called when a user was taken out of the application context.
@param adInfo The info of the ad.
*/
func didLeaveApplication(with adInfo: ISAdInfo!) {
}
/**
Called when a banner presented a full screen content.
@param adInfo The info of the ad.
*/
func didPresentScreen(with adInfo: ISAdInfo!) {
}
/**
Called after a full screen content has been dismissed.
@param adInfo The info of the ad.
*/
func didDismissScreen(with adInfo: ISAdInfo!) {
}
리스너 전체 구현에 대한 설명은 여기를 확인해 주세요.
2단계. 배너 로드하기
배너광고를 기본설정으로 로드하려면 아래와 같이 메서드를 호출해 주세요:
-
- 아래 메서드를 호출하여 Banner View를 초기화합니다. (본 예제에서는 배너의 사이즈는 “BANNER” 사이즈 입니다)
[IronSource loadBannerWithViewController:self size:ISBannerSize_BANNER];
let bannerSize = ISBannerSize("description: "BANNER", width: 320, height: 50)
IronSource.loadBanner(with:YOUR_VIEW_CONTROLLER, size: bannerSize!)
아래 테이블에서 지원되는 표준 배너 사이즈 상세 정보를 확인하세요:
ISBannerSize | 설명 | dp 단위 크기 (WxH) |
BANNER | 표준 배너 | 320 x 50 |
LARGE | 대형 배너 | 320 x 90 |
RECTANGLE | 중간 사각형 배너(MREC) | 300 x 250 |
SMART | 스마트 배너 (iPhone 및 iPad 기기 화면 크기에 맞게 조정) |
iPhone (화면 높이 720 이하): 320 x 50, iPad(화면 높이 720 points 초과): 728 x 90 |
-
- 또다른 방법으로 아래와 같이 배너를 특정 크기로 지정하여 초기화 할 수도 있습니다. (폭/높이는 points 단위):
[IronSource loadBannerWithViewController:self size:[[ISBannerSize alloc] initWithWidth:320 andHeight:50];
IronSource.loadBanner(with:YOUR_VIEW_CONTROLLER, size:
3단계. 안전영역 레이아웃 구현하기
안전영역 은 iOS 11부터 도입된 레이아웃 가이드를 말하며, iOS 앱 내 view들의 표시 허용 위치를 정의합니다. 이는 앱이 어떠한 네비게이션 및 탭 바 등 상위 뷰를 덮지 않게 하기 위함입니다.
안전영역 구현하기:
아래는 didLoad 메서드 내에서 배너를 초기화 및 로딩하는 예제입니다:
- (void)didLoad:(ISBannerView *)bannerView withAdInfo:(ISAdInfo *)adInfo{
NSLog(@"%s",__PRETTY_FUNCTION__);
dispatch_async(dispatch_get_main_queue(), ^{
self.bannerView = bannerView;
if (@available(iOS 11.0, *)) {
[self.bannerView setCenter:CGPointMake(self.view.center.x,self.view.frame.size.height - (self.bannerView.frame.size.height/2.0) - self.view.safeAreaInsets.bottom)]; // safeAreaInsets is available from iOS 11.0
} else {
[self.bannerView setCenter:CGPointMake(self.view.center.x,self.view.frame.size.height - (self.bannerView.frame.size.height/2.0))];
}
[self.view addSubview:self.bannerView];
});
}
func didLoad(_ bannerView: ISBannerView!, with adInfo: ISAdInfo!) {
print("\(#function)")
DispatchQueue.main.async {
self.bannerView=bannerView
if #available(iOS 11.0, *) {
bannerView.frame = CGRect(x: view.frame.size.width/2 - bannerView.frame.size.width/2, y: view.frame.size.height - bannerView.frame.size.height, width: bannerView.frame.size.width, height: bannerView.frame.size.height -
self.view.safeAreaInsets.bottom * 2.5)
} else {
bannerView.frame = CGRect(x: view.frame.size.width/2 - bannerView.frame.size.width/2, y: view.frame.size.height - bannerView.frame.size.height, width: bannerView.frame.size.width, height: bannerView.frame.size.height * 2.5)
}
view.addSubview(bannerView)
}
}
4단계. 추가 로드 설정
유니티 레벨플레이 대시보드에서는 배너의 플레이스먼트 (게재 위치), 횟수 제한 및 빈도 제한 설정이 지원됩니다. 여기에서 배너의 플레이스먼트, 횟수 제한 및 빈도 제한 설정하여 앱의 사용자 경험을 최적화 하는 방법을 알아보세요.
배너의 플레이스먼트를 설정했다면, 아래의 메서드를 호출해서 해당 플레이스먼트에 배너 광고를 게재하세요:
[IronSource loadBannerWithViewController:self size:ISBannerSize_BANNER placement:placement];
IronSource.loadBanner(with: YOUR_VIEW_CONTROLLER, size: YOUR_BANNER_SIZE, placement: YOUR_PLACEMENT_NAME)
5단계. 배너광고 삭제
배너를 삭제하려면 아래의 메서드를 호출합니다:
[IronSource destroyBanner: bannerView];
IronSource.destroyBanner(YOUR_IRONSOURCE_BANNER)
삭제된 배너는 더 이상 로드가 불가능합니다. 다시 배너 광고를 게재하려면, 다시 초기화부터 진행 해야 합니다.
6단계. 배너 광고 제공 네트워크 연동
다음은 유니티 레벨플레이 미디에이션을 통해 배너를 게재할 수 있도록 광고 네트워크를 연동합니다.
지원되는 네트워크 및 각 네트워크의 배너 사이즈 별 동작은 아래와 같습니다:
BANNER | LARGE | RECTANGLE | SMART | |
ironSource | Banner | Large | Medium Rectangle | Banner / Leaderboard |
AdMob | Banner | Large* | Medium Rectangle | Banner / Leaderboard |
Amazon | Banner |
Banner | Banner | Leaderboard ** |
AppLovin | Banner | Banner | Medium Rectangle | Banner / Leaderboard |
Chartboost | Banner | Banner | Medium Rectangle | Banner / Leaderboard |
Meta Audience Network |
Banner | Large | Medium Rectangle | Banner / Leaderboard |
Digital Turbine | Banner | Banner | Medium Rectangle | Banner / Leaderboard |
HyprMX | Banner | – | Medium Rectangle | Banner / Leaderboard |
InMobi | Banner | Banner | Medium Rectangle | Banner / Leaderboard |
UnityAds | Banner | Banner | Medium Rectangle | Leaderboard |
Vungle | Banner | Banner | Medium Rectangle | Banner / Leaderboard |
배너 사이즈 참조
- Banner: 320 X 50
- Large Banner: 320×90
- Medium Rectangle (MREC): 300×250
- LeaderBoard: 728X90
* AdMob은 Large를 320X100으로 정의합니다.
** Amazon Leaderboard를 728X50으로 정의합니다.
6단계. 적응형 배너
T적응형 배너 기능은 광고의 폭과 화면 크기에 따라 최적화된 배너 사이즈 정보를 받을 수 있는 기능입니다.
이 기능을 사용하면 적응형 배너를 지원하는 네트워크들 (현재는 AdMob과 Ad Manager만이 지원됨)은 배너 사이즈에 기반해 최적의 높이를 가진 광고를 제공합니다. 적응형 배너를 지원하지 않는 여타 네트워크들의 경우 앞에서의 경우와 같이 지정된 사이즈로 동일하게 배너를 제공합니다.
- 배너 사이즈를 객체로 지정하고 해당 객체에서 아래와 같이 “adaptive” 플래그를 추가합니다.
- 로드 성공 대리자(Delegate)인 didLoad에서 로드 또는 갱신될 배너 광고의 사이즈를 수신하여 앱 내 배너 view 를 조정할 수 있습니다.
- 업데이트된 배너 사이즈는 대리자(delegate)의 ISBannerView 파라미터의 일부로 반환되며, 배너 갱신 중 변경될 수 있습니다.
- 적응형 배너는 지정된 폭의 크기에 맞춰 최적화되어 제공됩니다.
완료했습니다!
이제 앱에 배너 광고를 개제할 준비가 완료되었습니다. Integration Helper를 사용해서 연동이 잘 되었는지 점검해 보세요.
다음에는 뭘 할까요?
아래의 연동 가이드를 따라서 또 다른 광고 유닛들을 연동해 보세요:
더 많은 미디에이션 아답터 연동에 관심이 있으시다면, 아이언소스에서 지원하는 미디에이션 네트워크를 확인해 보세요.