> ## Documentation Index
> Fetch the complete documentation index at: https://docs.kameleoon.com/llms.txt
> Use this file to discover all available pages before exploring further.
# Tracker JavaScript Mixpanel
> Envoyez les événements d'exposition aux expériences Kameleoon à Mixpanel à l'aide du tracker JavaScript, et utilisez les cohortes Mixpanel pour cibler et personnaliser les campagnes Kameleoon.
[Mixpanel](https://mixpanel.com/) est une solution d'analyse comportementale des utilisateurs de premier plan pour les équipes produit.
Deux types d'intégration sont disponibles :
* Kameleoon utilise le module Experiments natif de Mixpanel, vous permettant d'analyser l'impact de toute campagne via Kameleoon dans l'interface native de Mixpanel pour les expériences.
* Vous pouvez également exporter automatiquement les données de cohortes Mixpanel dans Kameleoon, où elles peuvent être utilisées pour une segmentation supplémentaire afin de personnaliser les parcours clients.
Vous pouvez configurer les deux selon vos besoins.
**Avantages clés :**
* Observez comment vos campagnes Kameleoon influencent les interactions des utilisateurs avec vos sites web.
* Identifiez et reproduisez facilement les A/B tests et personnalisations efficaces.
* Concentrez-vous sur les caractéristiques comportementales les plus pertinentes de vos segments et trouvez rapidement de nouvelles informations pour faire avancer votre feuille de route de tests.
* Accédez aux données de cohortes pour personnaliser l'expérience des visiteurs et améliorer la performance des campagnes de personnalisation.
## Envoyer les données d'événements de vos campagnes Kameleoon vers vos tableaux de bord Mixpanel
Avec le pont Kameleoon/Mixpanel, vous pouvez récupérer les données de vos personnalisations et expériences Kameleoon (événements d'exposition) sur votre plateforme Mixpanel.
### Activer l'intégration Mixpanel dans Kameleoon
Pour utiliser Mixpanel, vous devez l'activer dans la page Integrations. Pour ce faire :
1. Connectez-vous à l'application Kameleoon.
2. Cliquez sur **Admin** > **Integrations** > **Install the tool**.
3. Sélectionnez les projets sur lesquels vous souhaitez configurer Mixpanel.
4. Cliquez sur **Validate**.
Vous verrez alors un interrupteur **ON** à droite de la ligne de l'outil, ainsi que le nombre de projets sur lesquels l'outil est configuré.
Les événements d'exposition des campagnes seront envoyés automatiquement à Mixpanel.
Si vous devez modifier le comportement de notre pont natif, vous pouvez [créer un pont d'analyse personnalisé](../custom-analytics-integration) et utiliser l'exemple de code Mixpanel sur [notre dépôt Github](https://github.com/Kameleoon/custom-analytics-integrations/tree/master/mixpanel).
### Associer Mixpanel comme outil de reporting à une campagne Kameleoon
Vous pouvez associer Mixpanel à une campagne dans la page de création de la campagne. Sélectionnez-le dans la liste des **REPORTING TOOLS**.
Kameleoon transmettra automatiquement les données (nom de l'expérience et nom de la variante) à Mixpanel en utilisant l'API Experiment de Mixpanel.
## Cibler les visiteurs sur Kameleoon en fonction de leur appartenance à une cohorte Mixpanel
### Activer l'intégration Kameleoon sur Mixpanel
Vous devez activer l'intégration Kameleoon dans votre compte Mixpanel pour activer la synchronisation des cohortes. [Vous pouvez vous référer à cette documentation Mixpanel](https://help.mixpanel.com/hc/en-us/articles/360055834811-Kameleoon-Integration).
Vous aurez besoin d'une clé API Kameleoon. Demandez la clé à votre Customer Success Manager Kameleoon.
Seuls les profils utilisateurs identifiés sont exportés vers Kameleoon (pas d'utilisateurs anonymes). Si vous utilisez la fonctionnalité de fusion d'identités de Mixpanel, étant donné que le `distinct_id` Mixpanel d'un utilisateur donné peut changer au fil du temps, nous vous recommandons vivement de définir une propriété utilisateur supplémentaire **`$kameleoon_mapping_id`** contenant notre [code visiteur Kameleoon](../../../../../developer-docs/apis/activation-api-js/api-reference/api-reference#visitor) ou « votre ID utilisateur interne » si vous utilisez l'un de nos [SDK](../../../../../developer-docs/feature-experimentation/get-started/overview). Mixpanel ajoutera automatiquement le `kameleoon_mapping_id` à chaque export de cohorte qu'il envoie à Kameleoon.
Vous pouvez définir le `kameleoon_mapping_id` à l'aide de la [méthode Mixpanel `people.set`](https://docs.mixpanel.com/docs/tracking-methods/sdks/javascript#setting-profile-properties), juste après l'exécution de la méthode identify. Voici un exemple de code que vous pouvez utiliser avec l'API JavaScript de Mixpanel :
```javascript theme={null}
mixpanel.people.set({
'$kameleoon_mapping_id': Kameleoon.API.Visitor.code
});
```
Mixpanel utilise notre [endpoint map de l'API Data](/api-reference/map/update-data-for-several-keys) pour envoyer les cohortes à Kameleoon.
### Créer une donnée personnalisée pour cibler les cohortes Mixpanel dans vos expériences
Pour cibler les cohortes Mixpanel, vous devez configurer une donnée personnalisée dans Kameleoon afin de récupérer les noms de cohortes pour chaque utilisateur.
Nommez votre donnée personnalisée « **Mixpanel cohorts** » et choisissez la méthode d'acquisition **Custom JavaScript code** si vous exécutez une expérience web classique, ou **Kameleoon SDK method** si vous exécutez une expérience côté serveur ou utilisez un feature flag.
La donnée personnalisée doit être définie sur les types **list of** et **strings**, et la portée peut être définie sur **Page**, selon la portée définie dans Mixpanel. Lorsque définie sur **Page**, les données sont réévaluées à chaque chargement de page si l'utilisateur appartient à une certaine cohorte identifiée par Mixpanel.
### Synchronisation de segments externes pour les expériences web
Si vous utilisez la propriété `$kameleoon_mapping_id` comme expliqué dans la section précédente, utilisez le code ci-dessous dans la méthode d'acquisition de données personnalisées :
```javascript theme={null}
Kameleoon.API.Data.retrieveDataFromRemoteSource(Kameleoon.API.Visitor.code, function (data) {
if (data?.mixpanel_cohorts) {
data.mixpanel_cohorts.map(function (segment) {
if (segment?.mixpanel_cohort_id) {
Kameleoon.API.Data.setCustomData("Mixpanel cohorts", segment.mixpanel_cohort_id);
}
});
}
});
return { "value": null}
```
Si vous préférez utiliser la méthode `distinct_id` par défaut de Mixpanel pour définir votre propre ID utilisateur, utilisez le code ci-dessous :
```javascript theme={null}
if (!window.mixpanel?.get_distinct_id) return null;
let id = mixpanel.get_distinct_id();
Kameleoon.API.Data.retrieveDataFromRemoteSource(id, function (data) {
if (data?.mixpanel_cohorts) {
data.mixpanel_cohorts.map(function (segment) {
if (segment?.mixpanel_cohort_id) {
Kameleoon.API.Data.setCustomData("Mixpanel cohorts", segment.mixpanel_cohort_id);
}
});
}
});
return { "value": null}
```
### Synchronisation de segments externes côté serveur
Pour utiliser les cohortes Mixpanel dans des expériences ou feature flags côté serveur, vous pouvez consulter les directives décrites dans la documentation de chaque SDK. Par exemple, si vous utilisez le [SDK GO](../../../../../developer-docs/sdks/web-sdks/go-sdk#retrieving-data-from-a-remote-source), vous pouvez consulter sa documentation pour des instructions détaillées.
Le SDK GO, comme nos autres SDK, utilise la méthode `getRemoteData()`. Cette méthode récupère les données stockées par Mixpanel sur nos serveurs et les rend accessibles dans votre code backend.
### Récupérer les noms de cohortes Mixpanel dans Kameleoon
Activez l'option **Save the values for the targeting condition associated with the custom data point**, et insérez ce snippet dans le champ dédié. Remplacez la valeur « `ADD_YOUR_PROJECT_ID_HERE` » par votre sitecode de projet.
```javascript theme={null}
var xhr = new XMLHttpRequest();
xhr.open("GET", 'https://customers.kameleoon.com/mixpanel/cohorts/ADD_YOUR_PROJECT_ID_HERE', false);
xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
var mixPanelSegments = [];
xhr.onreadystatechange = function() { // Call a function when the state changes.
if (this.readyState === XMLHttpRequest.DONE && this.status === 200)
{
var mixpanel = JSON.parse(xhr.response);
mixpanel.forEach(function (segment) {
if (segment.id && segment.name !== 'undefined')
{
mixPanelSegments.push({value: segment.id, label: segment.name});
}
});
}
}
xhr.send();
return mixPanelSegments;
```
### Utiliser les noms de cohortes Mixpanel dans un segment Kameleoon
Après avoir configuré la donnée personnalisée pour les noms de cohortes Mixpanel, vous pouvez créer des segments dans le générateur de segments Kameleoon en choisissant la donnée personnalisée et en sélectionnant **is among the values**. Une liste de tous les noms de cohortes de Mixpanel sera affichée. Sélectionner une ou plusieurs cohortes Mixpanel permettra de cibler les personnalisations et les expériences.