본 Playbook에서는 PC 웹으로 유입된 사용자가 웹사이트 내 QR코드를 통해 앱 설치를 하는 경우에도 성과 측정을 할 수 있는 방법에 대해서 안내합니다.
기여 시나리오
1. 사용자가 PC 웹에서 광고를 클릭한 후 웹사이트 내 QR 코드를 통해 앱 설치는 하는 경우 - 클릭 된 광고를 앱 설치의 기여로 인정
2. 광고에 노출/클릭 없이 웹사이트에 들어온 사용자가 웹사이트 내 QR 코드를 통해 앱설치를 하는 경우 - QR 코드 스캔을 앱 설치의 기여로 인정
사전 준비 사항
설정 방법
웹사이트(PC)에 QR 코드를 심을 element를 준비하고, QR Code 동적 생성을 위한 스크립트를 아래와 같이 심습니다.
<!-- QR Code를 심을 Element -->
<div id="qrcode"></div>
<!-- QR Code 동적 생성을 위한 스크립트 -->
<script src="https://static.airbridge.io/sdk/utils/qrcode.min.js"></script>
<script>
airbridge.fetchResource(function(res){
var qrcode = new QRCode("qrcode", {
text: "https://abr.ge/@"+airbridge.app.appSubdomain+"/airbridge.websdk?campaign=qrcode&client_id="+res.browser.clientID,
width: 128, // QR Code width 조정
height: 128, // QR Code height 조정
colorDark : "#000000",
colorLight : "#ffffff",
correctLevel : QRCode.CorrectLevel.H
});
});
</script>
캠페인 파라미터 변경 및 추가
웹사이트(PC)에 QR코드가 다수 있는 경우, QR코드 별로 text
옵션 값의 campaign=qrcode
부분을 다르게 세팅(예: campaign=main_qrcode
, campaign=product_qrcode
)하거나 추가적인 캠페인 파라미터를 사용(ex. campaign=qrcode&content=mainpage_button
, campaign=qrcode&sub_id=mainpage
)할 수 있습니다.
💡 유의사항
- 위 스크립트를 심기 이전에 Airbridge Web SDK가 설치되어 있어야합니다. 설치 방법은 가이드를 참고해주세요.
- 웹사이트를 통한 광고 트래킹을 위해서는 Protected Attribution Window 옵션이 적용되어 있어야 합니다. init시
useProtectedAttributionWindow
옵션을true
로 넣어주세요. 자세한 내용은 가이드를 참고해주세요.- 트래킹링크(text 옵션 부분)의 채널(
airbridge.websdk
) 부분을 수정하시면 기여 우선순위가 변경되어 앱 설치의 기여가 광고 터치포인트로 인정되지 않으므로, 변경하지 마시기 바랍니다.
데모 페이지 코드
본 링크에서 실제 QR코드가 적용 된 예시를 확인할 수 있습니다.
참고사항
- QR Code 생성 라이브러리는 davidshimjs/qrcodejs를 사용하고 있습니다.