스마트 배너 SDK는 웹사이트나 웹 앱에 Adjust 스마트 배너를 추가할 수 있도록 해줍니다. 이 가이드는 프로젝트에 SDK를 연동하는 방법을 보여줍니다.
1. SDK 설치
기존 Javascript 프로젝트에 SDK를 추가하려면 패키지 매니저를 사용하여 설치하시기 바랍니다.
디펜던시 설치가 완료되면 프로젝트로 가져오기 합니다.
import AdjustSmartBanner from "@adjustcom/smart-banner-sdk";
CDN 사용
런타임 디펜던시로의 설치를 원하지 않는다면 SDK를 CDN(콘텐츠 전송 네트워크)을 통해 로딩할 수 있습니다. 로딩 시 SDK는 글로벌 AdjustSmartBanner
네임스페이스를 통해 액세스될 수 있습니다.
CDN을 통해 SDK를 로딩하는 경우 퍼포먼스 향상을 위해 최소화된 버전을 사용해야 합니다.
- 특정 버전. 예:
https://cdn.adjust.com/adjust-smart-banner-0.0.7.min.js
- 최신 버전. 예:
https://cdn.adjust.com/adjust-smart-banner-latest.min.js
SDK 파일은 최대한 빨리 제공되기 위해 CDN에 캐시됩니다. 캐시는 30분마다 새로고침 됩니다. 업데이트를 즉시 수신하려면 SDK의 특정 버전을 대상으로 지정하시기 바랍니다.
CDN을 통해 스마트 배너 SDK를 로드하려면 페이지의 <head>
태그에 다음 스니펫을 붙여 넣습니다.
<script type="application/javascript"> !(function (e, n, t, a, o, s, r, i, c) { var d = o + "_q"; (e[o] = e[o] || {}), (e[d] = e[d] || []); for (var u = 0; u < s.length; u++) r(e[o], e[d], s[u]); (i = n.createElement(t)), (c = n.getElementsByTagName(t)[0]), (i.async = !0), (i.src = "https://cdn.adjust.com/adjust-smart-banner-latest.min.js"), (i.onload = function () { e[o] = e[o].default; for (var n = 0; n < e[d].length; n++) e[o][e[d][n][0]] ? e[o][e[d][n][0]].apply(e[o], e[d][n][1]) : console.error( "No such function found in " + o + ": " + e[d][n][0], ); e[d] = []; }), c.parentNode.insertBefore(i, c); })( window, document, "script", 0, "AdjustSmartBanner", [ "init", "show", "hide", "setLanguage", "setIosDeepLinkPath", "setAndroidDeepLinkPath", "setContext", "setAndroidAppSchema", "setDeepLinkPath", ], function (e, n, t) { e[t] = function () { n.push([t, arguments]); }; }, );</script>
2. SDK 초기화
스마트 배너 SDK를 초기화하려면 AdjustSmartBanner.init
메서드를 호출합니다.
AdjustSmartBanner.init({ appToken: "APP_TOKEN",});
이 메서드를 호출하면 SDK는 기기 플랫폼을 감지합니다. 모바일 플랫폼 기기인 경우 SDK는 사용 가능한 스마트 배너를 로딩하고, 초기화 이후 대상 배너가 즉시 표시됩니다.
프로젝트가 단일 플랫폼 앱을 타겟팅하는 경우, 각 플랫폼 토큰을 appToken
객체의 키로 전달합니다.
AdjustSmartBanner.init({ appToken: { ios: "IOS_APP_TOKEN", android: "ANDROID_APP_TOKEN", },});
3. 배너 로컬라이제이션
더 나은 사용자 경험을 위해 스마트 배너 언어를 로켤라이제이션할 수 있습니다. 스마트 배너 SDK는 브라우저에서 사용된 언어를 읽고, 배너의 로켤라이제이션된 사본이 있는 경우 이를 표시합니다. 이러한 액션을 오버라이드하려면 SDK가 다른 언어를 사용하도록 설정할 수 있습니다. 언어 설정에는 두 가지 방법이 있습니다.
AdjustSmartBanner.init
메서드에language
파라미터로써 전달합니다.- 문자열 파라미터로 2자 언어 코드를 사용하여
setLanguage
메서드를 호출합니다.
AdjustSmartBanner.setLanguage("fr");
이제 모든 단계가 완료되어, SDK가 프로젝트에 연동됩니다. SDK의 기능과 각기 다른 기능을 구성하는 방법에 대한 정보는 본 섹션의 기타 가이드를 참조하시기 바랍니다.