> ## Documentation Index
> Fetch the complete documentation index at: https://docs.reelevant.com/llms.txt
> Use this file to discover all available pages before exploring further.
# Content Script et intégration on-site
> Configurez des intégrations on-site côté client sur votre site web à l'aide du content script de l'extension de navigateur
## Vue d'ensemble
Le content script est la partie de l'extension de navigateur qui s'exécute sur les pages de votre site web. Il vous permet de configurer des **intégrations on-site** — des emplacements côté client où le script de tracking Reelevant injecte du contenu personnalisé dans un élément spécifique du DOM.
C'est l'équivalent no-code de l'intégration manuelle par [Client Side Script](/fr/developer-docs/web-integration/client-side-script/overview). L'interface du content script écrit la configuration de l'intégration dans votre Workflow afin que le script de tracking puisse charger du contenu sur les pages correspondantes.
## Ouvrir l'interface d'intégration on-site
1. Connectez-vous à l'extension et ouvrez un [Workflow](/fr/product-guide/browser-extension/workflows) doté d'un Channel côté client.
2. Rendez-vous sur la page de votre site web où l'intégration doit s'exécuter.
3. Ouvrez le panneau d'intégration on-site pour la zone du Channel ciblé.
Le titre du panneau affiche le Workflow, le Channel et le nom de la zone (par exemple, `ON-SITE - LIFECYCLE PLP (BANNIERE) - Zone #1`).
## Champs configurables
L'extension n'expose que les paramètres disponibles dans l'interface d'intégration on-site :
| Champ | Description |
| -------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ |
| **Selector** | Sélecteur CSS de l'élément DOM cible. Saisissez un sélecteur manuellement ou utilisez l'icône d'engrenage pour choisir un élément visuellement sur la page. |
| **Emplacement** | Manière dont le contenu est inséré par rapport à l'élément cible (par exemple, **Replace element**). |
| **Integration conditions** | Règles qui contrôlent le moment où l'intégration est active. Chaque condition comporte une variable, un opérateur (par exemple, **is**) et une valeur. Cliquez sur **Add condition** pour ajouter d'autres règles, ou supprimez celles qui existent avec l'icône de corbeille. |
| **Include page context for workflow?** | Lorsque cette option est activée, envoie le contexte de la page au Workflow afin qu'il puisse utiliser l'URL et les données au niveau de la page. |
| **Configure datalayer integrations** | Lorsque cette option est activée, expose le mappage des variables du datalayer pour l'intégration. |
| **Custom code** | Lorsque cette option est activée, affiche un éditeur de code où vous pouvez écrire du JavaScript pour personnaliser la manière dont l'intégration interagit avec le DOM de la page. |
| **Enabled for everyone?** | Lorsque cette option est activée, l'intégration s'exécute pour tous les visiteurs. Lorsqu'elle est désactivée, elle est limitée aux utilisateurs correspondant aux règles de ciblage de votre Workflow. |
Cliquez sur **Save** pour enregistrer la configuration dans le Workflow.
## Sélecteur DOM
Cliquez sur l'icône d'engrenage à côté du champ **Selector** pour activer le sélecteur DOM visuel sur la page courante. Survolez les éléments pour les mettre en surbrillance, puis cliquez pour en sélectionner un. Le sélecteur CSS généré est inséré dans le champ **Selector**.
Le sélecteur DOM fonctionne sur n'importe quel site web sur lequel vous naviguez tant que l'extension est active. Assurez-vous d'être sur la bonne page où vous souhaitez que le contenu Reelevant apparaisse.
## Comment cela s'articule avec l'intégration côté client
Les intégrations on-site configurées via l'extension sont consommées par le script de tracking côté client de Reelevant au moment de l'exécution. Le script analyse la page, met en correspondance les intégrations actives avec l'URL et les conditions courantes, puis injecte la sortie du Workflow dans le sélecteur configuré.
Pour l'installation du script, la gestion de l'identité, l'utilisation du datalayer et d'autres concepts côté client, consultez [Client Side Script](/fr/developer-docs/web-integration/client-side-script/overview).