PC 사용자 QR 코드로 앱 다운로드 유도하기

목표

광고를 통해 PC 웹으로 유입된 사용자가 웹사이트 내 QR코드를 통해 앱 설치를 했습니다. 이처럼 QR코드를 통해 PC 웹에서 앱으로 유저의 기기 환경이 전환될 때, 광고 클릭을 통해 들어온 사용자의 앱 설치에 대한 기여를 "광고 클릭" 터치포인트로 잡고자 합니다.

만약 광고 클릭 터치포인트가 없는 경우에는 "QR 코드 스캔" 터치포인트를 앱 설치의 기여로 잡고자 합니다.

준비사항

Airbridge Web SDK 설치

방법

웹사이트(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 부분을 다르게 세팅(ex. campaign=main_qrcode, campaign=product_qrcode)하거나 추가적인 캠페인 파라미터를 사용(ex. campaign=qrcode&content=mainpage_button, campaign=qrcode&sub_id=mainpage)할 수 있습니다.

❗️

유의사항

  1. 위 스크립트를 심기 이전에 Airbridge Web SDK가 설치되어 있어야합니다. 설치 방법은 가이드를 참고해주세요.
  2. 웹사이트를 통한 광고 트래킹을 위해서는 Protected Attribution Window 옵션이 적용되어 있어야 합니다. init시 useProtectedAttributionWindow 옵션을 true로 넣어주세요. 자세한 내용은 가이드를 참고해주세요.
  3. 트래킹링크(text 옵션 부분)의 채널(airbridge.websdk) 부분을 수정하시면 기여 우선순위가 변경되어 앱 설치의 기여가 광고 터치포인트로 인정되지 않으므로, 변경하지 마시기 바랍니다.

데모 페이지 코드

링크

참고사항