> ## Knowledge Base Index
> Fetch the complete knowledge base index at: https://help.screeb.app/sitemap.xml
> Use this file to discover available pages before exploring further.
> Pure-Markdown content can be obtained by appending a '.md' suffix to the content URLs listed in the sitemap (without the trailing slash).

# Comment intégrer des Surveys directement sur votre site web

**Améliorez l'engagement utilisateur en intégrant des surveys directement dans les pages de votre site web. Suivez ces étapes pour configurer et personnaliser vos surveys in-page sans expertise technique requise.**

### ${color}[#5b7083](1️⃣ Allez dans Surveys)

Naviguez vers la section survey de votre compte pour créer ou gérer vos surveys.

![](https://storage.crisp.chat/users/helpdesk/website/-/b/7/7/3/b773c527a4dce800/03571f4f-3e1d-4966-a14d-1ad3a7_1qzemsm.png)

### ${color}[#5b7083](2️⃣ Sélectionnez Survey Intégré In-page)

Choisissez l'option "Survey Intégré In-page" pour intégrer le survey de façon transparente dans votre contenu web.

![](https://storage.crisp.chat/users/helpdesk/website/-/2/8/c/0/28c0cce815d2bc00/fde17cf9-e693-4d46-92ba-135a33_10o4x0w.png)

### ${color}[#5b7083](3️⃣ Ciblage et placement)

1. **Définissez l'audience cible :** Fixez des règles pour préciser qui verra le survey, par exemple selon le comportement utilisateur ou les pages vues spécifiques.
2. **Choisissez le placement :** Identifiez l'emplacement exact sur votre page web où le survey doit apparaître en fournissant un sélecteur CSS.

![](https://storage.crisp.chat/users/helpdesk/website/-/8/4/7/c/847ca6bf48a83800/51e2d203-ce3c-421d-a1f5-ae8930_9ldt76.png)

###### Comment trouver le sélecteur CSS :

* Utilisez l'outil "Sélectionner un élément" pour choisir visuellement l'élément désiré sur votre site.
* Entrez l'URL de votre site web (assurez-vous que le tag Screeb est installé) pour ouvrir un nouvel onglet où vous pouvez sélectionner directement l'élément à intégrer.

![](https://storage.crisp.chat/users/helpdesk/website/-/f/e/c/d/fecd09f3dde39800/08967563-4640-49bc-b198-301a43_1tg11h7.png)

Exemple :

![](https://storage.crisp.chat/users/helpdesk/website/-/1/c/4/c/1c4c6bed4ab3040/f7c0c36b-f5fc-4442-a9b7-f49279_j94icp.png)

Utilisez "sélectionner un élément" pour choisir directement sur votre site, ou utilisez directement la classe CSS.
Ensuite, confirmez simplement l'emplacement.

![](https://storage.crisp.chat/users/helpdesk/website/-/c/b/8/1/cb81821789eb980/e854972d-ae28-4c32-bbba-e6998a_h30uul.png)

* Si vous connaissez la classe ou l'ID CSS, vous pouvez aussi le saisir manuellement.
* Vous pouvez aussi utiliser des sélecteurs CSS avancés pour trouver n'importe quel élément DOM.
* `.is-home-page, .is-user-page` Utilisez une virgule pour matcher plusieurs éléments.
* `[class*="-page"]` Matche tout élément dont les classes contiennent "-page".
* Consultez la doc W3C sur les sélecteurs CSS pour des usages plus avancés : [https://www.w3schools.com/cssref/css_selectors.php](https://www.w3schools.com/cssref/css_selectors.php)

###### Comment trouver la classe CSS ?

Regardez cette vidéo :
${frame}[](https://www.youtube.com/embed/0QAyqXDpwbE)

### ${color}[#5b7083](4️⃣ Personnalisez vos surveys)

* Après avoir défini le placement, allez dans les Paramètres de Design de votre workspace pour ajuster l'apparence du survey. Adaptez-le au design de votre site pour une expérience utilisateur cohérente.

💡Astuces :
**Aperçu** : Prévisualisez toujours le survey sur différents appareils pour vous assurer qu'il s'affiche bien partout.
**Test** : Vérifiez le placement et le fonctionnement du survey sur différents navigateurs et tailles d'écran.
**Optimisation** : Surveillez la performance du survey et ajustez-la selon le feedback utilisateur.