Edit

Launching an Overlay Placement

The Rokt SDK for React Native can be used to display an overlay placement overtop of your app’s content. These instructions assume that the Rokt SDK for React Native has already been integrated into your application by following steps 1 to 4 here.

Step 5: Import the Rokt SDK into the JS file

Import the Rokt SDK into the JS file:

import { Rokt, RoktEmbeddedView } from "@rokt/react-native-sdk";

Step 6: Execute the Rokt React Native SDK

Execute the SDK at the desired point by passing the appropriate consumer attributes. The Rokt Placement will then display after a short delay that is configurable via the Rokt platform.

Your app dictates which consumer attributes are passed through to Rokt. More information on the data fields that are able to be passed through the SDK can be found under the Attributes section. You can add additional code lines into the below sections containing consumer attributes in order to build up the data package that will be sent through to Rokt.

attributes = {
      "email": "j.smith@example.com",
      "firstname": "Jenny",
      "lastname": "Smith",
      "mobile": "(323) 867-5309",
      "postcode": "90210",
      "country": "US"
}

Rokt.execute("RoktExperience", attributes, null,  () => console.log("Placement Loaded"));

Note: The ViewName (“RoktExperience”) can be modified when executing the SDK in multiple locations in order to display a different experience according to the context of where in the app the SDK is being executed. If modifying the ViewName, please work with the Rokt team to ensure matching adjustments are made within the Rokt System.

Step 7: Build & Run