Last updated 24 oct. 2023

Ajouter un emplacement

Pour les partenaires Rokt, le SDK Rokt pour React Native peut être utilisé pour afficher des emplacements superposés sur le contenu de votre application.

Avant de commencer

Assurez-vous que le SDK Rokt React Native a été intégré dans votre application.

Emplacements superposés

Importer le SDK

Importez le SDK dans le fichier JavaScript de votre application :

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

Exécution du SDK

Exécutez le SDK au point souhaité en ajoutant les attributs clients appropriés. L'emplacement Rokt s'affichera ensuite après un court délai configurable via la plateforme Rokt.

Vous pouvez dicter quels attributs clients sont inclus dans votre intégration Rokt. Plus d'informations sur les champs de données disponibles peuvent être trouvées sur la page attributs. Si vous souhaitez intégrer plus d'attributs, vous pouvez ajouter des lignes de code supplémentaires pour chaque nouvel attribut aux exemples ci-dessous.

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

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

remarque

Le ViewName ("RoktExperience") peut être modifié lors de l'exécution du SDK à plusieurs endroits pour afficher une expérience différente en fonction du contexte où le SDK est exécuté dans l'application. Si vous modifiez le ViewName, travaillez avec l'équipe Rokt pour vous assurer que les ajustements correspondants sont effectués dans le système Rokt.

Emplacements intégrés

Importez le SDK

Importez le SDK Rokt dans le fichier JavaScript :

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

Créez une référence de placeholder

Créez une référence de placeholder dans votre fichier JavaScript :

 constructor(props){
    super(props);
    this.placeholder1 = React.createRef();
  }

Ajoutez RoktEmbeddedView à votre vue

Ajoutez RoktEmbeddedView dans render(). L'emplacement intégré de Rokt sera injecté dans ce placeholder lorsque la méthode execute est appelée :

<RoktEmbeddedView
  ref={this.placeholder1}
  placeholderName={"RoktEmbedded1"}
></RoktEmbeddedView>

Exécution du SDK Rokt React Native

Exécutez le SDK au point souhaité en envoyant les attributs clients appropriés. L'emplacement Rokt s'affiche ensuite après un court délai configurable via la plateforme Rokt.

placeholders = {
  RoktEmbedded1: findNodeHandle(this.placeholder1.current),
};

attributes = {
  email: "j.smith@example.com",
  firstname: "Jenny",
  lastname: "Smith",
  mobile: "(323) 867-5309",
  postcode: "90210",
  country: "US",
};
Rokt.execute("RoktEmbeddedExperience", attributes, placeholders, () =>
  console.log("Placement Loaded")
);

remarque

Le NomDeLaVue ("RoktEmbeddedExperience") peut être modifié lors de l'exécution du SDK à plusieurs endroits. Cette configuration vous permet d'afficher une expérience différente en fonction du contexte dans lequel le SDK est exécuté dans l'application. Si vous modifiez le NomDeLaVue, veuillez travailler avec l'équipe Rokt pour vous assurer que les ajustements correspondants sont effectués dans le système Rokt.

Avant de commencer​

Emplacements superposés​

Importer le SDK​

Exécution du SDK​

Emplacements intégrés​

Importez le SDK​

Créez une référence de placeholder​

Ajoutez RoktEmbeddedView à votre vue​

Exécution du SDK Rokt React Native​