아임웹 쇼핑몰에 DPA 전환 스크립트 4개(공통 + ViewContent + AddToCart + Purchase)를 설치하는 방법입니다.
이벤트별 코드 구성과 공통 주의사항은 [DPA 전환 스크립트 설치 가이드]를 먼저 확인 부탁드립니다.
아임웹은 관리자에서 이벤트별 스크립트 삽입 위치를 제공하므로, 디자인 코드를 직접 수정하지 않고 설치할 수 있습니다.
이미 데이블 일반 전환 스크립트(Purchase, AddToCart)를 설치하신 경우, 아래 DPA용 코드(items: [{ product_id }] 포함)로 교체해 주세요. 두 개가 함께 있으면 전환이 중복 집계됩니다.아임웹 공식 가이드
스크립트 삽입 위치와 사용 가능한 변수는 아임웹 공식 문서를 함께 참고 부탁드립니다.
•
스크립트 직접 삽입(고급 설정) — 이벤트별 스크립트 삽입 및 변수 안내
•
사이트에 공통으로 스크립트 삽입하기 — Header Code 설치
설치 위치 요약
스크립트 | 아임웹 관리자 경로 |
공통 (PageView) | 환경설정 > SEO(검색엔진최적화) > Header Code |
ViewContent | 광고 캠페인 관리 > 데이터 연결 > 스크립트 직접 삽입(고급 설정) > 상품 조회 |
AddToCart | 광고 캠페인 관리 > 데이터 연결 > 스크립트 직접 삽입(고급 설정) > 장바구니 담기 |
Purchase | 광고 캠페인 관리 > 데이터 연결 > 스크립트 직접 삽입(고급 설정) > 구매 완료 |
각 항목의 토글을 켜고 body 영역에 코드를 넣은 뒤 페이지 상단의 저장 버튼을 눌러야 적용됩니다.
1. 공통 스크립트 (PageView)
1.
환경설정 > SEO(검색엔진최적화) > Header Code로 이동합니다.
2.
아래 코드를 넣고 저장합니다.
<!-- Dable 스크립트 시작 -->
<script>
(function(d,a,b,l,e,_) {
d[b]=d[b]||function(){(d[b].q=d[b].q||[]).push(arguments)};e=a.createElement(l);
e.async=1;e.charset='utf-8';e.src='//static.dable.io/dist/dablena.min.js';
_=a.getElementsByTagName(l)[0];_.parentNode.insertBefore(e,_);
})(window,document,'dablena','script');
dablena('init', '000-000-000'); // 내 계정 번호로 변경
dablena('track', 'PageView');
</script>
<!-- Dable 스크립트 종료 -->
HTML
복사
2. ViewContent — 상품 조회
1.
광고 캠페인 관리 > 데이터 연결 > 스크립트 직접 삽입(고급 설정)으로 이동합니다.
2.
'상품 조회' 항목의 토글을 켜고 body 영역에 아래 코드를 넣습니다.
<!-- Dable 스크립트 시작 -->
<script>
(function(d,a,b,l,e,_) {
d[b]=d[b]||function(){(d[b].q=d[b].q||[]).push(arguments)};e=a.createElement(l);
e.async=1;e.charset='utf-8';e.src='//static.dable.io/dist/dablena.min.js';
_=a.getElementsByTagName(l)[0];_.parentNode.insertBefore(e,_);
})(window,document,'dablena','script');
dablena('init', '000-000-000'); // 내 계정 번호로 변경
dablena('track', 'ViewContent', {
items: [{ product_id: '$prod_code' }] // ★ 아임웹 상품코드 변수 — 아래 '주의사항' 참고
});
</script>
<!-- Dable 스크립트 종료 -->
HTML
복사
3. AddToCart — 장바구니 담기
1.
같은 화면에서 '장바구니 담기' 항목의 토글을 켜고 body 영역에 아래 코드를 넣습니다.
<!-- Dable 스크립트 시작 -->
<script>
(function(d,a,b,l,e,_) {
d[b]=d[b]||function(){(d[b].q=d[b].q||[]).push(arguments)};e=a.createElement(l);
e.async=1;e.charset='utf-8';e.src='//static.dable.io/dist/dablena.min.js';
_=a.getElementsByTagName(l)[0];_.parentNode.insertBefore(e,_);
})(window,document,'dablena','script');
dablena('init', '000-000-000'); // 내 계정 번호로 변경
dablena('track', 'AddToCart', {
items: [{ product_id: '$prod_code' }] // ★ 아임웹 상품코드 변수 — 아래 '주의사항' 참고
});
</script>
<!-- Dable 스크립트 종료 -->
HTML
복사
4. Purchase — 구매 완료
1.
같은 화면에서 '구매 완료' 항목의 토글을 켜고 body 영역에 아래 코드를 넣습니다.
2.
결제 금액은 아임웹 변수 $total_price를 사용합니다.
<!-- Dable 스크립트 시작 -->
<script>
(function(d,a,b,l,e,_) {
d[b]=d[b]||function(){(d[b].q=d[b].q||[]).push(arguments)};e=a.createElement(l);
e.async=1;e.charset='utf-8';e.src='//static.dable.io/dist/dablena.min.js';
_=a.getElementsByTagName(l)[0];_.parentNode.insertBefore(e,_);
})(window,document,'dablena','script');
dablena('init', '000-000-000'); // 내 계정 번호로 변경
dablena('track', 'Purchase', {
value: $total_price, // 아임웹 결제 금액 변수
currency: 'KRW',
items: [
{ product_id: '$prod_code' } // ★ 주문 상품코드 — 아래 '주의사항' 참고
]
});
</script>
<!-- Dable 스크립트 종료 -->
HTML
복사
1.
저장 버튼을 눌러 적용합니다.
주의사항
•
product_id는 EP의 상품 ID와 동일해야 합니다. 아임웹 네이버 쇼핑 EP에 등록된 상품 ID(상품코드)와 같은 값이 스크립트에 들어가야 리타게팅이 작동합니다.
•
상품코드 변수(★): $total_price는 아임웹 공식 변수이며, 상품코드 변수명은 스크립트 직접 삽입(고급 설정) 안내 및 관리자 화면의 각 항목 변수 목록에서 확인 후 그에 맞게 수정 부탁드립니다. 안내된 변수명이 $prod_code와 다르면 그 이름으로 바꿔 넣으시면 됩니다.
•
구매 완료 항목에서 여러 상품을 함께 주문한 경우, 아임웹이 제공하는 상품 목록 변수 형태에 따라 items 배열 구성이 달라질 수 있습니다. 첫 상품만 전송되어도 매출(value)은 집계됩니다.
•
•
설치 완료 후
설치가 완료되면 계정 번호와 함께 ad-kr@dable.io로 회신 부탁드립니다. 데이블에서 ViewContent / AddToCart / Purchase 수집 여부와 product_id 매칭 상태를 확인한 뒤 안내드립니다. 직접 확인은 전환 스크립트 설치 확인하기를 참고 부탁드립니다.
