스마트 배너(모바일 웹-앱 전환 링크)

요약: 전 세계 웹사이트 트래픽 대부분은 모바일 디바이스에서 발생합니다. 모바일 웹사이트에 스마트 배너를 걸어 웹 트래픽을 앱으로 전환시키세요.

Smart Banners

앱스플라이어 스마트 배너 SDK 를 웹사이트에 삽입하여 스마트 배너를 구현합니다. 초기 이 작업 외 추가 코딩은 없습니다.

스마트 배너를 이용하여 모바일 웹사이트에서 유입되는 앱 유저(앱 인스톨)의 가치를 측정할 수 있습니다. 스마트 배너로 클릭률(click-through, 클릭 수/노출 수)과 노출 수를 기록할 수 있습니다.

클릭: 사용자가 스마트 배너를 클릭하여 앱을 설치한 스마트 배너 클릭 수가 기록됩니다.
노출: 배너가 (사용자에게) 노출되었을 때, 노출 카운트 이벤트가 앱스플라이어에 전송됩니다.

참고

스마트 배너가 귀하에게 적합한 솔루션인지 확실하지 않습니까?
스마트 배너를 다른 앱스플라이어 솔루션과 비교하십시오.

작업 범위

직무별 작업

마케터 및 웹사이트 개발자

웹사이트 개발자는 웹사이트 HTML에 코드 스니펫을 입력하기만 하면 됩니다.
그 외 다른 설정은 모두 마케팅 담당자가 할 수 있습니다.

선행 조건

최소 한 개 이상의 앱이 등록된 앱스플라이어 계정
스마트 배너로 광고를 할 앱이 등록된 원링크 템플릿
원링크 템플릿은 모바일 웹 방문자를 사용 기기에 따라 알맞은 앱스토어 페이지로 이동시키기 위해 스마트 배너에서 꼭 필요합니다.

소요 시간

약 20 분

작업 결과

웹사이트에서 CTA를 클릭하면 사용 기기에 따라 알맞은 앱스토어나 지정된 웹페이지로 이동합니다.
CTA 버튼을 클릭하는 모바일 앱 유저는 앱 내 콘텐츠로 딥링킹 됩니다.
사용자 클릭 및 앱 설치 가 온드 미디어 소스에 어트리뷰션 됩니다.

예시

철수는 'Feed Me'라는 성공한 식품 배달 서비스의 마케터입니다. 철수는 Feed Me 모바일 웹사이트를 방문한 사람들을 앱 유저로 전환시키고자 합니다.

이 목적을 달성하기 위해 철수는 시각 자료와 텍스트로 스마트 배너를 만들어 활용합니다.

스마트 배너는 원링크로 작동됩니다. 모바일 웹사이트에서 CTA 버튼을 클릭하면, 자동으로 사용 기기에 따라 적절한 앱스토어나 랜딩 페이지로 이동시켜, 앱을 쉽게 다운로드 받을 수 있도록 합니다. 앱이 이미 설치된 사람이 CTA 버튼을 클릭하면, 앱이 실행됩니다.

그러면 앱스플라이어는 철수가 지정한 미디어 소스와 캠페인을 클릭/인스톨에 대해 어트리뷰션한 것으로 기록합니다.

중요!

앱스플라이어 스마트 배너나 iOS 사파리 스마트 앱 배너 둘 중 하나만 사용하고, 두 개를 동시에 사용하지 마십시오.둘을 동시에 사용하면 모바일 웹사이트 디스플레이 이슈가 발생할 수 있고 어트리뷰션 데이터 불일치가 일어날 수 있습니다.

절차

다음 절차를 따라 스마트 배너 설정을 완료하십시오.

스마트 배너를 통해 모바일 사이트에 방문한 사람을 사용 기기에 맞춰 적절한 앱스토어나 앱 페이지로 이동시킵니다.
원링크를 이용해 클릭/인스톨에 대한 어트리뷰션을 온드 미디어로 기록합니다.

1. 웹사이트 설정

스마트 배너를 게재할 모바일 사이트 준비하기:

앱스플라이어 대시보드에서인게이지먼트 & 딥링킹 > 스마트 배너를 클릭합니다.
왼쪽 상단 웹사이트 작업 공간 옆 점 3개 클릭 후웹사이트 작업 공간 생성을 클릭합니다.
웹사이트 작업 공간 이름을 입력합니다.
웹사이트 작업 공간 생성을 클릭합니다.
웹사이트 작업 공간이 열립니다.
배너 코드 스니펫을 복사합니다.
코드 스니펫을 프론트 엔드 개발자에게 전달하여 웹사이트에 구현하도록 합니다.
프론트 엔드 개발 작업은 간단하고 한 번 뿐이며 이 단계 이후는 웹사이트 코딩 작업이 없습니다.
[선택 사항] 웹 키 를 복사합니다 . (이 키는 이미 코드 스니펫에 있습니다.)
계속을 클릭합니다.

2. 배너 그룹 설정

배너 그룹에는 하나 이상의 배너가 들어 있습니다. 배너 그룹에서 다음을 수행할 수 있습니다.

배너 그룹에 사용할 원링크 템플릿을 선택할 수 있습니다. 이 원링크 템플릿은 웹사이트 방문자를 이동시킬 모바일 앱이 설정되어 있습니다.
특정 딥링킹 스킴을 설정할 수 있습니다.
배너 그룹의 모든 배너에서 사용할 타겟팅 로직, 스케쥴, 동작, 어트리뷰션 세부 정보를 정의할 수 있습니다.
사용자가 방문시, 배너 그룹의 배너를 활성화시키는 페이지를 설정할 수 있습니다.

새 배너 그룹 설정하기

앱스플라이어 대시보드에서인게이지먼트 & 딥링킹 > 스마트 배너를 클릭합니다.
왼편에 배너 그룹 추가를 클릭합니다.
고유한 배너 그룹 이름을 입력합니다.
배너 그룹 이름은 배너 간 공동 주제를 반영하고 배너 그룹을 대표할 수 있어야 합니다. (예: 광고를 집행한 앱 이름)
배너 그룹에 사용할 원링크 템플릿을 선택합니다.
[선택사항] 배너 그룹에 대한 URI 스킴을 iOS 유니버설 링크와 안드로이드 앱 링크 사용자에 대한 대체 옵션으로 설정할 수 있습니다. 기본적으로 이 값은 원링크 템플릿에서 가져오기 때문에 이 설정이 필요한 경우는 드뭅니다. 원링크 템플릿에 있는 값과 다른 값이 필요할 경우에만 배너 그룹의 URI 스킴을 설정하십시오.
배너 그룹 가동을 스케쥴링합니다. 기본 설정은 '즉시 시작'이며 캠페인 시작 및 종료 시간을 설정할 수 있습니다.
배너 그룹을 집행할 위치(지역)을 설정합니다.
전 세계를 선택하면 이 배너 그룹이 모든 사용자에게 나타납니다. 배너 노출 대상에서 특정 지역이나 국가에서 유입되는 방문자를 제외하도록 설정할 수 있습니다. 특정 위치를 선택 하면 이 배너 그룹이 특정 지역(단수/복수 모두 가능)의 사용자에게만 노출됩니다.
배너 그룹이 방문자에게 보여지는 웹사이트의 활성화 페이지를 설정합니다.
- 모든 페이지에서 활성화: 웹사이트의 모든 페이지에서 배너 그룹을 노출합니다.
- URL 부분 지정: 지정된 URL 부분을 포함한 웹사이트 페이지에서만 배너 그룹이 노출되도록 합니다.
해제 동작을 설정합니다. 즉, 사용자가 배너를 닫은 시점부터 배너가 다시 나타날 때까지의 간격을 설정합니다. 배너 재노출 간격은 다음 중 선택할 수 있습니다.
- 시간별: 1시간, 1일 또는 1주
- 다음 세션: 사용자가 배너를 닫은 후 30분 이상이 지나면 발생하는 세션
- 안 함: 배너를 다시 보이지 않습니다.
  일러두기: 브라우저 캐시를 지우거나 시크릿 모드에서 웹사이트를 방문할 경우, (배너) 해제 동작 설정이 적용되지 않습니다.
[선택사항] 최대 빈도 제한을 설정합니다.
최대 빈도 제한은 한 사용자에게 배너를 노출시키는 최대 횟수를 정의합니다. 예를 들어, 최대 빈도 제한이 3으로 설정되면, 사용자가 해당 사이트를 네 번 방문했을 때, 세 번째 방문까지만 배너를 볼 수 있고 네 번 째 방문 시에는 볼 수 없습니다. 최대 빈도 제한 옵션에는 무제한도 있습니다. 최대 빈도 제한 옵션에서 무제한이나 제한을 선택합니다.

어트리뷰션 소스(Attributed sources) 가 이 배너 그룹에서 발생한 신규 인스톨에 대해 어트리뷰션으로 기록되도록 설정합니다. 다음 표에서 커스터 링크에 가장 적합한 옵션을 선택하세요.

옵션	사용하기 적합한 경우	댓글
기본 어트리뷰션 파라미터 사용	모바일 웹사이트 방문자 대부분이 오가닉인 경우 논오가닉 방문자가 애드 네트워크 클릭이나 UTM 파라미터 소스를 통해서 웹사이트에 도달하지 않는 경우	중요: 이 값들은 커스텀 링크에서 미디어 소스, 캠페인 혹은 채널 명이 없을 때 대체 옵션으로 사용됩니다.
UTM 파라미터 사용	논오가닉 방문자 대부분이 UTM 파라미터로 확인할 수 있는 소스로부터 모바일 웹사이트에 유입된 경우	미디어 소스 이름 (pid) = UTM_Source 캠페인 (c) = UTM_campaign UTM_source 또는 UTM_campaign이 누락된 경우 정적(static) 이름이 대신 사용됩니다.
유입되는 어트리뷰션 링크 파라미터 사용	논오가닉 방문자 대다수가 앱스플라이어 어트리뷰션 링크를 사용하는 애드 네트워크를 클릭하여 모바일 웹사이트로 유입되는 경우.	파라미터가 앱스플라이어 어트리뷰션 링크와 스마트 배너에 모두 있으면, 최종 커스텀 링크에는 어트리뷰션 링크가 우선순위를 갖습니다.
다른 어트리뷰션 파라미터를 추가하기	웹사이트 관련 다른 어트리뷰션 데이터를 추가하려면 다음을 수행하십시오. 이렇게 어트리뷰션 파라미터를 여러가지로 설정하면, 각 앱 인스톨을 더욱 상세히 분석할 수 있습니다.	예를 들어, 이커머스 사이트에서는 모든 상품 카테고리에 대해 동일한 커스텀 링크를 생성하고 af_adset 값만 다르게 설정합니다. (예: "af_adset=fruit")

기본 어트리뷰션 파라미터, 채널명 을 설정하여 a스마트 배너로 발생하는 모든 인스톨들에 대해 설정된 채널명으 어트리뷰션되도록 합니다. 이렇게 하여 다양한 미디어 소스 정보를 동일한 채널명 하에 취합하여 코호트 리포트, 개요 대시보드, 리텐션 리포트 등에서 나타낼 수 있습니다.
배너 그룹 생성을 클릭합니다.
[선택 사항] 배너 그룹을 수정하려면 타겟팅 및 동작 위에 커서를 두고 편집을 클릭합니다.

예시

철수는 Fee Me의 채식주의자 버거 메뉴 홍보 캠페인을 캘리포니아에서 집행하기로 합니다.

새 배너 그룹을 만들고, "Feed me burgers"라고 이름을 붙입니다.
Feed Me 앱에 대한 원링크 템플릿을 선택하고 다음과 같은 경로 "feedme://search/veganburgers"로 URI 스킴을 덮어씁니다.
철수는 위치를 캘리포니아 주로 설정해서 캘리포니아에서 접속하는 사람만 배너 그룹을 볼 수 있도록 합니다.
URL 부분은 "burgers"로 지정하여 URL에 "burgers"가 있는 웹페이지만 이 배너 그룹이 보이도록 합니다.
동적 미디어 소스와 캠페인 이름을 어트리뷰션 데이터로 선택하고 채널명을 "feed_me_burgers"로 설정하여 앱스플라이어에서 설정값과 관련된 모든 데이터를 집계하도록 합니다.

3. 배너 설정

새 배너 그룹에서 첫 번째 배너를 만들기

배너 생성 을 클릭하여 배너 추가 페이지로 들어갑니다.
배너의 이름을 입력합니다.
광고 소재 디자인을 클릭하여 배너 광고 소재를 설정합니다. (상세 내용 아래 설명)
새 광고 소재를 설정하고 저장하면, 배너 상태가 '활성화'가 됩니다. 활성화와 일시 정지로 상태를 조절할 수 있습니다.
[선택 사항] 필요시, 배너에만 적용되는 어트리뷰션 파라미터를 추가합니다. 예: 광고 이름
UA 어트리뷰션 링크를 리타겟팅 URL으로 전환시키려면, is_retargeting=true 파라미터를 추가합니다.
모두 저장하고 닫기를 클릭합니다.

배너 광고 소재 설정

스마트 배너 광고 소재 만들기

배너 설정 페이지에서 광고 소재 디자인 을 클릭하고 광고 소재를 설정합니다.
광고 소재 템플릿을 선택하고, 그 위에 마우스 커서를 올려 놓으면 나오는 만들기 버튼을 클릭하여 광고 소재 작성 창에서 광고 소재를 작성합니다.
광고 소재 작성 창에서 다양한 디자인의 템플릿으로 실험을 할 수 있습니다.
텍스트와 이미지를 게재하고자 하는 콘텐츠로 변경합니다.
이미지 파일은 .png, .jpeg, 혹은 .jpg 형식으로만 올려야 합니다. 그리고 이미지 URL은 파일 확장자를 포함해야 합니다. 예를 들어, https://example.com/my_image.png 는 유효한 URL입니다. 그러나 https://example.com/my_image 은 유효하지 않은 URL입니다.
이미지 입력 필드의 i 아이콘 위에 커서를 두고 도움말을 확인하세요.
광고 소재 작성을 클릭합니다.

4. 테스트하기

광고 소재가 준비되면 실제 운영 서번에 게시하기 전 테스트를 합니다.

스마트 배너 광고 소재 테스트하기

전제 조건: 스마트 배너 코드 스니펫이 웹사이트에 들어가 있는지 확인하십시오.

광고 소재 테스트 페이지에서, 스마트 배너 SDK가 추가될 웹페이지 링크를 입력합니다. (다음 탭 참조)
Generate를 클릭합니다.
생성된 링크를 복사하여 테스트 기기에 보내거나 테스트 기기로 QR 코드를 스캔합니다. 이 링크나 QR 코드는 설정된 광고 소재로 만든 배너가 게시되는 웹페이지로 이동시킵니다.
광고 소재 편집 을 클릭하여 광고 소재 구성 화면으로 돌아가거나 완료 를 클릭하여 광고 소재 구성을 저장합니다.

앱스플라이어는 광고주가 웹사이트에 삽입할 수 있는 스마트 배너 SDK를 제공합니다. SDK는 필요한 데이터를 가져와 스마트 배너에 데이터를 동적으로 표시합니다. 스마트 배너 SDK는 또, 적절한 어트리뷰션 링크를 자동으로 생성해, 링크를 따로 만들 필요가 없습니다.

스마트 배너 SDK는 모바일 배너가 게재되는 모든 페이지에서 접근할 수 있어야 합니다.

스마트 배너 SDK는 웹 키를 이용하여 인증합니다. 웹 키는 웹사이트 작업 공간에서 얻을 수 있습니다.

코드 스니펫

참고

2020년 1월 1일에 스마트 배너를 위한 새로운 SDK가 나왔습니다.

이 새 앱스플라이어 웹 SDK로 웹사이트에서 스마트 배너와 유저 중심 어트리뷰션(People-based Attribution)을 둘 다 사용할 수 있습니다. 아래 SDK 스니펫은 두 가지 예시를 보여줍니다.

모바일 배너를 게재하는 모든 페이지의 <head> 태그에 코드 스니펫을 삽입합니다.

스마트 배너만을 사용하는 용도의 앱스플라이어 앱 SDK

스크립트 내 YOUR_WEB_KEY 플레이스 홀더를 웹 키로 바꿉니다. 웹 키는 웹사이트 작업 공간을 새로 만들 때 생성됩니다.
이 코드 스니펫을 귀사의 웹사이트 head 태그에 붙여넣습니다. 헤드 태그의 맨 위 가까이에 붙여넣도록 하십시오.

<script>
!function(t,e,n,s,a,c,i,o,p){t.AppsFlyerSdkObject=a,t.AF=t.AF||function(){
(t.AF.q=t.AF.q||[]).push([Date.now()].concat(Array.prototype.slice.call(arguments)))},
t.AF.id=t.AF.id||i,t.AF.plugins={},o=e.createElement(n),p=e.getElementsByTagName(n)[0],o.async=1,
o.src="https://websdk.appsflyer.com?"+(c.length>0?"st="+c.split(",").sort().join(",")+"&":"")+(i.length>0?"af_id="+i:""),
p.parentNode.insertBefore(o,p)}(window,document,"script",0,"AF","banners",{banners: {key: "YOUR_WEB_KEY"}});

AF('banners', 'showBanner');

</script>

스마트 배너와 유저 중심 어트리뷰션(PBA)용 앱스플라이어 웹 SDK

스크립트 내 YOUR_WEB_KEY 플레이스 홀더를 웹 키로 바꿉니다. 웹 키는 웹사이트 작업 공간을 새로 만들 때 생성됩니다.
스크립트 내 YOUR_PBA_KEY 플레이스 홀더를 귀하의 web dev key로 바꿉니다. web dev key는 브랜드 번들을 생성할 때 만들어집니다.
이 코드 스니펫을 귀사의 웹사이트 head 태그에 붙여넣습니다. 헤드 태그의 맨 위 가까이에 붙여넣도록 하십시오.

<script>
!function(t,e,n,s,a,c,i,o,p){t.AppsFlyerSdkObject=a,t.AF=t.AF||function(){
(t.AF.q=t.AF.q||[]).push([Date.now()].concat(Array.prototype.slice.call(arguments)))},
t.AF.id=t.AF.id||i,t.AF.plugins={},o=e.createElement(n),p=e.getElementsByTagName(n)[0],o.async=1,
o.src="https://websdk.appsflyer.com?"+(c.length>0?"st="+c.split(",").sort().join(",")+"&":"")+(i.length>0?"af_id="+i:""),
p.parentNode.insertBefore(o,p)}(window,document,"script",0,"AF", "pba,banners",{pba: {webAppId: "YOUR_PBA_KEY"}, banners: {key: "YOUR_WEB_KEY"}});

AF('banners', 'showBanner');

</script>

        <script>
          !function(e,n,t){!function(e,n,t,r,a){
          var s=(e[n]=e[n]||{})[t]=function(){(s._q=s._q||[]).push(Array.prototype.slice.call(arguments))};
          s.webkey=a;
          for(var i=0;i<r.length;i++)
          s[r[i]]=function(n)
          {return function()
          {var e=Array.prototype.slice.call(arguments);
          return e.unshift(n),(s._q=s._q||[]).push(e),s}}
          (r[i])}(e,"AF","Banner",["showBanner","hideBanner","disableBanners","disableTracking","setAdditionalParams"],t),
          function(e,n,t){var r=e.createElement("script");
          r.type="text/javascript",r.async=!0,r.src=n+(t?"?webkey="+t:"");
          var a=e.getElementsByTagName("script")[0];
          a.parentNode.insertBefore(r,a)}(n,"https://cdn.appsflyer.com/web-sdk/banner/latest/sdk.min.js",t)}(window,document,"YOUR-BANNER-KEY");
          window.AF.Banner.showBanner();
        </script>

태그 매니저를 사용하여 SDK 추가하기

태그 매니저를 사용하여 스마트 배너 SDK를 귀하의 웹사이트에 추가합니다.

GTM에서 새 태그를 작성합니다.
태그 이름을 지정하고 Tag Configuration 을 클릭하고 Custom HTML 을 선택합니다.
HTML 상자에 SDK 스니펫을 붙입니다. 스니펫에 있는 YOUR-BANNER-KEY를 실제 배너 키로 교체합니다.
Triggering 을 클릭하고 화면 상단 우측의 플러스(+) 아이콘을 클릭해서 새로운 트리거를 만듭니다.
트리거 이름을 정하고, Trigger Configuration을 클릭하고 Page View를 선택합니다.
배너를 모든 페이지에서 노출시키려면, All Page Views를 선택합니다. 배너를 특정 페이지에서만 보이려면,Some Page Views를 선택하고 위에서 만든 태그를 트리거하는 조건을 정의합니다. 트리거에 대한 상세 내용은 GTM 문서를 읽어보십시오.
상단 우측 코너에 있는 Save 버튼을 클릭합니다.
태그 구성 화면으로 돌아가십시오. 모두 다 잘 설정되었는지 점검하고 상단 우측 코너에 있는 Save 를 클릭합니다.
GTM 컨테이너를 퍼블리시하십시오.

1단계: Adobe Experience Cloud에 property를 생성합니다.

스마트 배너 SDK를 호스트하는 property(태그)를 작성합니다.

Adobe Experience Cloud > Launch로 가십시오.
Adobe Experience Cloud Launch아래 Go to Launch을 클릭합니다.
New Property를 클릭합니다.
property 이름을 정합니다.
Platform아래 Web을 선택합니다.
귀하의 웹사이트 도메인을 입력합니다.
저장 버튼을 클릭합니다.

2단계: 스마트 배너 SDK를 Adobe Launch property에 추가합니다.

스마트 배너 SDK를 태그에 추가합니다.

My web property 페이지에서 Rules 탭을 선택합니다.
규칙의 이름을 지정한다. Load Smart Banners를 사용하기를 권고합니다.
IF 섹션에서 EVENTS 아래 +Add을 클릭합니다.
- Event Type에서 Core - DOM Ready를 선택하십시오.
- Keep Changes를 클릭합니다.
THEN 섹션에서 Actions 아래, +Add을 클릭합니다.
- Action Type > Custom Code를 클릭하십시오.
- JavaScript > Open Editor를 클릭하고 스마트 배너 SDK 스니펫을 <script> 태그 없이 붙입니다.
- Keep Changes 를 클릭하여 code editor를 닫습니다.
저장 버튼을 클릭합니다.

3단계: Adobe Launch 태그를 귀하의 웹사이트에 추가합니다.

Adobe Launch 태그를 귀하의 웹사이트에 추가합니다. 이 태그는 스마트 배너 웹 SDK를 로드합니다.

My web property 페이지에서 Environments 탭을 선택합니다.
퍼블리시할 환경(개발 환경 혹은 실 운영 환경)이 있는 행을 찾으십시오.
- INSTALL 헤더 아래 관련있는 행 위의 박스 아이콘을 클릭합니다. 이는 보통 실 운영 환경입니다.
- Adobe Launch 환경을 퍼블리시하는 방법에 대한 섹션을 참조하십시오.
Web Install Instructions 대화 상자에서
- 스크립트 코드 스니펫을 복사합니다.
- 대화 상자를 닫습니다.
코드 스니펫을 귀하의 웹사이트 <head> 태그에 붙여넣습니다.

4단계: Adobe Launch 환경을 퍼블리시합니다.

Adobe Launch 환경을 퍼블리시하여 Adobe Launch 태그를 활성화합니다.

My web property 페이지에서 Publishing 탭을 선택합니다.
Development 섹션에서 Add New Library을 클릭합니다.
1. 라이브러리 이름을 정하고 환경을 선택합니다.
2. RESOURCE CHANGES 아래에서 Add a Resource를 클릭합니다.
3. Rules > Load Smart Banners > Latest > Select & Create a New Revision을 클릭합니다.
4. 저장 버튼을 클릭합니다.
Development 섹션 아래에서
1. 새로 생성된 라이브러리 옆에 Action 메뉴 (점 3개)를 클릭해서 Build for Development를 선택합니다.
2. 다시 Action 메뉴를 클릭하고 Submit for Approval를 선택합니다.
Submitted 섹션 아래에서:
1. Action 메뉴를 클릭하고 Build for Staging를 선택합니다.
2. Action 메뉴를 클릭하고 Approve for Publishing를 선택합니다.
Approved 섹션 아래 action 메뉴를 클릭하고 Build & Publish to Production를 선택합니다.
이제 설정이 완료되었습니다.

웹사이트가 모바일에 로딩될 때, 배너의 활성화된 광고 소재가 노출됩니다. 배너를 특정 페이지나 특정 유저 액션에 따라서만 노출시키려면, Adobe Launch 규칙을 참조하십시오.

SDK 함수(function)

Showbanner

목적:

스니펫으로 제공된 배너 키에 따라 스마트 배너를 보여주기 시작합니다.

파라미터 (선택 사항):

bannerContainerQuery
이 함수가 전달되면, SDK가 이 쿼리로 페이지 내 요소(element)를 찾으려고 시도하고, 이 요소를 배너 배치를 위한 엔트리 포인트(entry point)로 사용합니다. 혹은 document.body 이 사용됩니다.
additionalParams
If passed, these parameters are added as query parameters to the banner URL.

예:

AF('banners', 'showBanner', { bannerContainerQuery: "#container-id",
additionalParams: { p1: "v1", p2: "v2"...}});

showBanner({ bannerContainerQuery: "#container-id", 
additionalParams: { p1: "v1", p2: "v2"...}});

hideBanner

목적

페이지에서 노출된 배너를 프로그램으로 제거합니다. (예: X초 동안 노출 후 배너 제거)

AF('banners', 'hideBanner')

disableBanners - 더 이상 사용하지 않음

목적

이 함수는 구 스마트 배너 SDK에서만 사용 가능하며 곧 폐기될 예정입니다.

웹 SDK가 배너를 게재하지 않고 앱스플라이어 서버와 통신하지 않도록 설정합니다.

disableTracking - 더 이상 사용하지 않음

목적

이 함수는 구 스마트 배너 SDK에서만 사용 가능하며 곧 폐기될 예정입니다.

웹 SDK를 끄고, 브라우저로부터 수집한 정보(예: 쿠키, 로컬 스토리지 등)의 흔적을 지웁니다.

setAdditionalParams -더 이상 사용하지 않음

목적

이 함수는 구 스마트 배너 SDK에서만 사용 가능하며 곧 폐기될 예정입니다.

showBanner를 호출하기 전에 additionalParams를 OneLink에 설정합니다. 이 파라미터들은 배너 뒤 원링크 URL에 추가됩니다.

파라미터

Params
기존 어트리뷰션 링크 파라미터(pid 값 제외)를 덮어쓸 수 있는 키/값 파라미터 맵입니다.

사용법 예시

특정 파라미터를 이용해 랜딩 페이지를 구분할 수 있습니다. 배너 뒤의 원링크에서 추가 파라미터를 추가합니다. 그리고나서 사용자가 배너를 클릭한 후 앱을 설치하면, 원링크의 파라미터가 앱스플라이어 로데이터에 나타납니다. 아래는 af_sub1 parameter를 활용한 코드 예시입니다.

// showBanner()를 호출하기 전에 이 메서드를 호출합니다.
setAdditionalParameters('af_sub': 'custom_paramter_value')

원링크 최종 형식은 다음과 같습니다. subdomain.onelink.me/onelink-id?pid=af_banner&c=campaign&af_sub1=custom_paramter_value

서브 도메인과 원링크 ID는 원링크 템플릿에서 가져옵니다.

예: ab12.onelink.me/xyz1?pid=af_banner&c=summer_campaign&af_sub1=uk_landing_page

유용한 파라미터는 모두 사용할 수 있습니다. 어트리뷰션 링크 파라미터에 대한 더 상세한 내용은 여기를 확인하십시오. pid와 c 파라미터를 덮어쓰지 않도록 주의하십시오. 이 파라미터들은 배너 뒤 어트리뷰션 링크에 이미 존재하고 있습니다.

getAdditionalParams- 더 이상 사용하지 않음

목적

이 함수는 구 스마트 배너 SDK에서만 사용 가능하며 곧 폐기될 예정입니다.

현재 additionalParams 오브젝트를 가져옵니다.

Smart Banners

참고

작업 범위

예시

중요!

절차

1. 웹사이트 설정

2. 배너 그룹 설정

예시

3. 배너 설정

배너 광고 소재 설정

4. 테스트하기

코드 스니펫

참고

스마트 배너만을 사용하는 용도의 앱스플라이어 앱 SDK

스마트 배너와 유저 중심 어트리뷰션(PBA)용 앱스플라이어 웹 SDK

태그 매니저를 사용하여 SDK 추가하기

1단계: Adobe Experience Cloud에 property를 생성합니다.

2단계: 스마트 배너 SDK를 Adobe Launch property에 추가합니다.

3단계: Adobe Launch 태그를 귀하의 웹사이트에 추가합니다.

4단계: Adobe Launch 환경을 퍼블리시합니다.

SDK 함수(function)

Showbanner

목적:

파라미터 (선택 사항):

예:

hideBanner

목적

disableBanners - 더 이상 사용하지 않음

목적

disableTracking - 더 이상 사용하지 않음

목적

setAdditionalParams -더 이상 사용하지 않음

목적

파라미터

사용법 예시

getAdditionalParams- 더 이상 사용하지 않음

목적

이 섹션의 문서

관련 문서

페이지 내용 :