Set the following parameters to control the behavior of the Smart Banner SDK.
Required parameters
Set your app token
To initialize the Smart Banner SDK, call the AdjustSmartBanner.init
method.
AdjustSmartBanner.init({ appToken: "APP_TOKEN",});
When you call this method, the SDK detects the device platform. If the device is a mobile platform, the SDK loads available smart banners. Available banners are displayed immediately after initialization.
If your project targets single-platform apps, pass each platform token as a key in the appToken
object.
AdjustSmartBanner.init({ appToken: { ios: "IOS_APP_TOKEN", android: "ANDROID_APP_TOKEN", },});
Optional parameters
Set your log level
Configure the verbosity of logging performed by the SDK.
Log level | Description |
---|---|
verbose | Print detailed messages about SDK actions |
info | Print basic info messages, warnings, and errors |
warning | Print only warning and error messages |
error | Print only error messages |
none | Don’t print anything |
AdjustSmartBanner.init({ logLevel: "verbose",});
Set your banner locale
Set the language
parameter to control which locale is used when displaying the banner.
AdjustSmartBanner.init({ language: "fr",});
Configure deep links
Configure deep links to specify where a user will land in your app when they interact with the smart banner.
Use the following parameters to control deep linking with your smart banners:
context
(Object): An object containing data to fill placeholders ({}
) in the deep link path.androidDeepLinkPath
(String): The location in the app to which the user is redirected on Android devices.iosDeepLinkPath
(String): The location in the app to which the user is redirected on iOS devices.context
(Object): An object containing values that are interpolated in theandroidDeepLinkPath
andiosDeepLinkPath
paths.
Examples
In this example, the banner redirects iOS users to a deep link path at products/product=cool_jeans_123
by interpolating the item_id
from the context
object.
AdjustSmartBanner.init({ // other initialisation parameters including mandatory ones iosDeepLinkPath: "products/product={item_id}", context: { item_id: "cool_jeans_123", },});
In this example, the banner redirects Android users to a deep link path at products/product=cool_jeans_123
by interpolating the item_id
from the context
object.
AdjustSmartBanner.init({ // other initialisation parameters including mandatory ones androidDeepLinkPath: "products/{item_id}", context: { item_id: "cool_jeans_123", },});
In this example, the banner redirects both iOS users and Android users to a deep link path at products/product=cool_jeans_123
by interpolating the item_id
from the context
object.
AdjustSmartBanner.init({ // other initialisation parameters including mandatory ones androidDeepLinkPath: "products/{item_id}", iosDeepLinkPath: "products/product={item_id}", context: { item_id: "cool_jeans_123", },});
You can use the context
object to define different context variables for different platforms. In this example:
- Android users are directed to
promo/new_user
. - iOS users are directed to
main/registrationFinished
. - The
unused_variable
is ignored.
AdjustSmartBanner.init({ // other initialisation parameters including mandatory ones androidDeepLinkPath: "promo/{android_promo}", iosDeepLinkPath: "main/{ios_promo}", context: { android_promo: "new_user", ios_promo: "registrationFinished", unused_variable: "this will be ignored", },});
Set the banner parent element
You can configure where a smart banner is located by specifying a parent element. By default, the banner is attached to document.body
. You can override this by specifying an existing HTMLElement
.
In this example, the smart banner is attached to an element with the ID root-for-banner
.
const element = document.querySelector("#root-for-banner");
AdjustSmartBanner.init({ bannerParent: element,});
Run a function when the banner is created
Use the onCreated
parameter to configure a function that runs as soon as the smart banner is created.
In this example, a log is output to the console when the banner is created.
AdjustSmartBanner.init({ onCreated: () => console.log("Smart banner shown"),});
Run a function when the banner is dismissed
Use the onDismissed
parameter to configure a function that runs any time the smart banner is dismissed.
In this example, a log is output to the console when the banner is dismissed.
AdjustSmartBanner.init({ onDismissed: () => console.log("Smart banner dismissed"),});