Banner Javascript Guide

4 분 소요

Youngjin Lee

현재 버전은 200 입니다.

지원 상품(사이즈)

상품 구분 사이즈
띠배너 300x50 ㅣ 320x50 ㅣ 320x100 ㅣ 640x240 ㅣ 640x100 ㅣ 728x90
전면배너 640x960 ㅣ 320X480 ㅣ 480x320 ㅣ 1024x768 ㅣ 750x1200 ㅣ 768x1024
종료배너 640x960 ㅣ 750x1200
정사각형 및 직사각형 200x200 ㅣ 240x400 ㅣ 240x240 ㅣ 250x250 ㅣ 250x360 ㅣ 300x250 ㅣ 336x280 ㅣ 150x150 ㅣ 580x400
스카이스크래퍼 120x600 ㅣ 160x600 ㅣ 300x600 ㅣ 300x1050
리더보드 468x60 ㅣ 728x90 ㅣ 930x180 ㅣ 970x90 ㅣ 970x250 ㅣ 980x120
네이티브 피드 640x960
네이티브 피드 배너 320x100 ㅣ 320x50

Sample Project

샘플 페이지 이동

Script 동작 환경

jQuery 추가

MANPLUS의 광고 스크립트는 JQuery 세팅 환경에서 동작합니다.
광고를 적용하실 페이지 에 JQuery 스크립트가 없을 경우, 아래의 태그를 삽입합니다.

<script type="text/javascript" src="https://advimg.ad-mapps.com/sdk/js/jquery-3.4.1.min.js"></script>

Script 추가

MANPLUS 광고를 추가하고 구동하기 위한 광고 스크립트를 추가합니다.
( 아래 코드와같 이 사용하셔야 내부적인 업데이트 진행 시 편리하게 이용하실 수 있습니다. )

<script type="text/javascript" src="https://advimg.ad-mapps.com/sdk/js/ver/200/ad_script.js"></script>

광고 옵션 설정

옵션

함수 옵션 설명 상품 기본값 필수 값
request adid adid 전송 전체 null hybrid app일 경우 Y 실제 ADID/IDFA를 전달
예)
Android :
158d87c5-add4-4646-b366-f39b5950dde1
iOS :
4A80248C-1BFC-4C9C-A643-B3B389043A20
request mPublisher 퍼블리셔 코드 전체   Y  
request mMedia 미디어 코드 전체   Y  
request mSection 섹션 코드 전체   Y  
request uAgeLevel User 나이 레벨 전체   Y 0: 만 13세 미만
1: 만 13세 이상
-1: 알수없음
request keyword 키워드 값 전달 전체   N 키워드값을 전달
구분자는 ^로 사용
구분자를 포함한 전체 문자열 인코딩(encodeURIComponent)
setView async 비동기 호출 여부 (passback 처리시 반드시 false 적용) 전체 false Y true : 비동기
false : 동기
상세내용
setView close_btn.show 닫기버튼 노출 여부 전면배너
전면동영상		 true N true : 노출
false : 비노출
setView close_btn.location 닫기버튼 위치 전면배너 3 N 1 : 상단 좌측
2 : 상단 중앙
3 : 상단 우측
4 : 중앙 좌측
5 : 중앙 우측
6 : 하단 좌측
7 : 하단 중앙
8 : 하단 우측
setView close_btn.images 닫기버튼 이미지 전면배너 기본 이미지 N  
setArea 첫번째 인자 광고 소재 높이에 따라 자동으로 채우기 띠배너 true Y true : 자동으로 채움
false : 매체 설정영역으로 채움
setArea 두번째 인자 높이 비율 (첫번째 인자가 true 일 경우에만 작동) 띠배너 100 N %

sync / async 모드

해당 옵션은 메조미디어 스크립트 내부에서 광고를 호출하는 방법에 대한 옵션입니다.

값 설명
false 기존 메조미디어 스크립트에서 사용 중인 방식입니다.
동기 모드로 광고를 호출하며, 광고 호출 시작부터 완료까지 일시적으로 block 처리됩니다.
MANPLUS를 통해 PASSBACK 광고를 진행 중일 경우, 해당 옵션을 false로 지정하셔야 정상적으로 광고물이 노출됩니다.
true 110 버전부터 새로 지원하는 방식입니다.
비동기 모드로 광고를 호출하며, 일시적인 block 처리 없이 광고가 노출됩니다.

광고 페이지 구성

소스코드

<head>
    <script type="text/javascript" src="https://advimg.ad-mapps.com/sdk/js/jquery-3.4.1.min.js"></script>
    <script type="text/javascript" src="https://advimg.ad-mapps.com/sdk/js/ver/200/ad_script.js"></script>
</head>	

<body>
	<div id="banner_test">
		<!-- AD Area -->
	</div>

	<script type="text/javascript" charset="utf-8">
		function adStart() {
			var mezzo_ad = new MezzoAD();

			var targetId = 'banner_test';

			mezzo_ad.setView(targetId, {
				async: false,
				close_btn: {
					show: true,
					location: '3',
					images: ['https://advimg.ad-mapps.com/sdk/M_PLUS/Image/script/inter/close.png'],
				},
			});

			mezzo_ad.setArea(true, 100);

			var codes = {
				adid: '',
				mPublisher: 'publisher_code',
				mMedia: 'media_code',
				mSection: 'section_code',
				uAgeLevel: '1', // 0: 만 13세 미만, 1: 만 13세 이상, -1: 알수없음
				keyword: '', // encodeURIComponent(키워드1^키워드2^키워드3)
			};

			mezzo_ad.request(codes, {
				success: function (type, status, data) {
					console.log(
						'[SUCCESS] type : ' + type + ' status : ' + status + ' data : ' + JSON.stringify(data)
					);
				},
				fail: function (type, status, data) {
					console.log(
						'[FAIL] type : ' + type + ' status : ' + status + ' data : ' + JSON.stringify(data)
					);
				},
				event: function (type, status, data) {
					console.log(
						'[EVENT] type : ' + type + ' status : ' + status + ' data : ' + JSON.stringify(data)
					);
				},
			});
		}

		adStart();
	</script>
</body>

Callback 정의

Callback type status 설명 상품
success guarantee 200 광고 성공 (보장형) 띠배너, 전면배너, 전면동영상
success house 200 광고 성공 (하우스) 띠배너, 전면배너, 전면동영상
fail noad 404 광고없음 띠배너, 전면배너, 전면동영상
fail error 405 Sync Mode 필요 (패스백) 띠배너, 전면배너, 전면동영상
fail error 408 요청 Timeout 띠배너, 전면배너, 전면동영상
fail error 415 AJAX Parsing 에러 띠배너, 전면배너, 전면동영상
fail error 498 중복 호출 에러 띠배너, 전면배너, 전면동영상
fail error 499 에러 띠배너, 전면배너, 전면동영상
fail error 501 지원하지 않는 브라우저 띠배너, 전면배너, 전면동영상
fail error 502 지원하지 않는 단말기 (iOS) 띠배너, 전면배너, 전면동영상
fail error 503 지원하지 않는 단말기 (Android) 띠배너, 전면배너, 전면동영상
event adclick 200 광고 클릭 띠배너, 전면배너, 전면동영상
event close 200 닫기 버튼 클릭 전면배너, 전면동영상
event start 200 영상 시작 전면동영상
event imp 200 영상 노출 전면동영상
event firstQ 200 영상 1/4 재생 전면동영상
event midQ 200 영상 2/4 재생 전면동영상
event thirdQ 200 영상 3/4 재생 전면동영상
event complete 200 영상 종료 전면동영상

샘플 페이지 이동

문의

구분 부서 이름 이메일 전화번호
제휴 문의     모바일 사업팀 곽대정 차장 daejeong.kwak@cj.net 02-6484-3973
ID발급 및 광고 세팅 문의          모바일 사업팀 장준혁 과장 junhyeok.jang@cj.net 02-6484-3415

업데이트: