# Widget de rappel

Dans cette section, vous apprendrez à configurer et à installer le widget de rappel sur votre site web. Ce widget de feedback permet aux visiteurs de contacter facilement votre entreprise et de poser des questions, ce qui vous aide à :

* Améliorer l’interaction avec les clients,
* Fournir une assistance rapide,
* Recueillir des retours et des suggestions précieux pour améliorer la satisfaction des utilisateurs.

## Paramètres

{% hint style="warning" %}

## Veuillez noter

Assurez-vous qu’une [intégration téléphonique](/doc/fr/integrations/other.md) est activée avant de configurer le widget de feedback. Ceci est requis pour l’installation.&#x20;
{% endhint %}

### Informations principales

#### **Paramètres des informations principales**

Cette section contient deux champs obligatoires pour configurer votre widget.

1. **Nom**\
   Saisissez un nom pour le widget, qui sera affiché sur votre site web. Ce champ est obligatoire.
2. **Domaine sur lequel le widget sera utilisé**\
   Saisissez le domaine du site web sur lequel le widget sera intégré. Ce champ est également obligatoire. Vous pouvez indiquer un site web créé sur :
   * **MaviBot**
   * **Tilda**
   * Votre propre **site web personnalisé**

**Paramètres avancés**\
Dans la section des informations principales, vous pouvez également activer **les notifications de rappel** dans les paramètres avancés.

<div data-with-frame="true"><figure><img src="/files/0353f7d7ca8b676c063bbdaf2004d991fc80d6ad" alt=""><figcaption></figcaption></figure></div>

{% hint style="info" %}
Les rappels du widget de feedback ne correspondent pas aux rappels de la téléphonie connectée.
{% endhint %}

Vous pouvez configurer plus tard la réponse du chatbot aux rappels reçus.

Vous pouvez également choisir d’afficher ou de masquer le logo « Nous utilisons MaviBot » à l’aide de cette case à cocher.

### Conditions de déclenchement

<div data-with-frame="true"><figure><img src="/files/cb6e72a3dc57ae78475f92bd476d62bb7e459580" alt="" width="521"><figcaption></figcaption></figure></div>

#### Intervalle de temps

Vous pouvez définir le moment d’apparition du widget sur le site web. Pour cela, utilisez la fonction « Quand afficher le widget ».

1. **Instantanément**\
   Ce paramètre affichera le widget dès que l’utilisateur ouvre le site web.
2. **Après un délai**

<div data-with-frame="true"><figure><img src="/files/10bde05eb31f085fc21ab49a3cc7e9942bf292bd" alt=""><figcaption></figcaption></figure></div>

Le widget apparaîtra un nombre de secondes défini après que l’utilisateur ait ouvert le site web.

Un intervalle de temps est défini en secondes, avec une valeur minimale de 1 seconde et une valeur maximale de 15 secondes.

3. **Après défilement**

<div data-with-frame="true"><figure><img src="/files/78c9c9aa64c64571f480ba81f63f75f381cc0586" alt=""><figcaption></figcaption></figure></div>

Le **La condition « Après défilement »** signifie que dès que l’utilisateur fait défiler le site web — qu’il aille jusqu’à la toute fin ou seulement sur une petite partie — le widget apparaîtra sur le site après le nombre de secondes spécifié.&#x20;

La valeur minimale de l’intervalle de temps est de 1 seconde ; la valeur maximale est de 15 secondes.

### Conditions d’affichage sur le site web

Vous pouvez définir l’affichage du widget avec ou sans conditions spécifiques. Explorons les conditions disponibles.

1. Paramètres UTM

{% hint style="info" %}
Pour en savoir plus sur les paramètres UTM et leur utilisation, nous vous recommandons de lire l’article, **"**[**Comment transférer les paramètres UTM**](/doc/fr/faq/questions/...transferer-les-etiquettes-utm.md)**."**
{% endhint %}

<div data-with-frame="true"><figure><img src="/files/4538700b45df074a8dcafbacd03c20ca69dac7e3" alt=""><figcaption></figcaption></figure></div>

Saisissez le nom du paramètre requis dans le champ correspondant.

<div data-with-frame="true"><figure><img src="/files/ebef6b70a13084d9fc11aa90b094c28a0f47335d" alt=""><figcaption></figcaption></figure></div>

Ensuite, sélectionnez l’opérateur qui correspond à la balise et à la valeur :

<div data-with-frame="true"><figure><img src="/files/b80a0bf195f29ca85adb0ab478be5f809960f70e" alt=""><figcaption></figcaption></figure></div>

{% hint style="info" %}
Quelle est la différence entre « contient/ne contient pas » et « égal à/ne vaut pas » ?

La principale différence est que **« contient/ne contient pas »** vérifie si le paramètre UTM inclut (ou n’inclut pas) une valeur spécifique à l’intérieur de celui-ci.

\
En revanche, **« égal à »** l’opérateur exige une correspondance exacte, ce qui signifie que le système recherche une égalité stricte de la valeur du paramètre UTM (et, en conséquence, « ne vaut pas » est l’inverse).
{% endhint %}

Saisissez ensuite la valeur requise pour le paramètre UTM :

<div data-with-frame="true"><figure><img src="/files/a499069dc00593f34a1ffd6478774334581c958e" alt=""><figcaption></figcaption></figure></div>

2. Pays

Vous pouvez également sélectionner la condition « Pays », qui affiche le widget en fonction du pays IP de l’utilisateur.\
Choisissez le pays requis dans la liste, ainsi que le type d’opérateur (« est » ou « n’est pas »).

3. **Appareil de l’utilisateur**

Si nécessaire, définissez la condition « Appareil » pour afficher le widget en fonction du type d’appareil de l’utilisateur.

Les paramètres incluent également une fonction permettant d’ajouter plusieurs valeurs pour contrôler l’affichage du widget. Pour cela, cliquez simplement sur **« + Ajouter une valeur »** et définissez une ou plusieurs conditions supplémentaires.

### Téléphonie

<figure><img src="/files/8358b63ec84a4eac40c7f7e90bf3d864c815a4d3" alt=""><figcaption></figcaption></figure>

## Horaires de travail

<figure><img src="/files/1850079a52dd22cfeccd8e8b80c8514eabfcb4f0" alt=""><figcaption></figcaption></figure>

Les horaires de travail jouent un rôle clé pour les cases à cocher **« Désactiver le widget en dehors des heures de bureau »** et **« Désactiver les rappels automatiques en dehors des heures de bureau »**"

<figure><img src="/files/dc2a02461105d340ea357e5ae50a2ca71b80b432" alt=""><figcaption></figcaption></figure>

Lorsque ces cases sont cochées, le widget sera inactif et/ou la fonction de rappel automatique ne fonctionnera pas en dehors des heures de travail de votre personnel.

\
C’est très pratique, car vos clients ne resteront pas à se demander pourquoi ils ont demandé un rappel sans en recevoir un.

Le **La case à cocher « Activer les rappels programmés à un moment opportun »** utilise également les horaires de travail : elle permet au système de proposer au client le créneau de rappel le plus proche disponible selon les heures de travail établies.

<figure><img src="/files/3818ee08d731f8fd1c4c1d9d5c394b5bc13826f5" alt=""><figcaption></figcaption></figure>

Pour configurer les heures de bureau, utilisez simplement les paramètres suivants :

<figure><img src="/files/a1e2aedd277f60b89461039e9ad18fd59ce2c481" alt=""><figcaption></figcaption></figure>

Vous pouvez configurer chaque jour de la semaine individuellement en basculant l’interrupteur sur la position désactivée.

<figure><img src="/files/bfbf307649eb9371ac7662a2b4d0aeef43e4dd36" alt=""><figcaption></figcaption></figure>

## Apparence

<figure><img src="/files/d7439363ca1758021e8e20612abb6afe0a526833" alt=""><figcaption></figcaption></figure>

Les paramètres d’apparence peuvent être divisés en paramètres du bouton et du widget.

### Paramètres du bouton

1. Taille du bouton : vous pouvez choisir parmi des tailles de bouton de widget grandes, moyennes et petites.

<figure><img src="/files/972a051ad0b73667a423cdd72be9168dfc260f64" alt=""><figcaption></figcaption></figure>

2. Texte du bouton

<figure><img src="/files/9fb8ebcea0a6f1ca89017ec58644b66da0992ecc" alt=""><figcaption></figcaption></figure>

Vous pouvez remplacer l’icône du téléphone par le texte de votre choix.

<div><figure><img src="/files/20186286c78ae47308f855b18744b329b5dbb7a0" alt="" width="135"><figcaption></figcaption></figure> <figure><img src="/files/69f27016878355cfbca828988cb0d698f859f892" alt=""><figcaption></figcaption></figure></div>

3. Couleur du bouton : utilisez la vaste palette de couleurs pour choisir la couleur qui convient le mieux à vos besoins.

<div><figure><img src="/files/4fc2cfd02200f1176116e98a378b430ce531a6f8" alt=""><figcaption></figcaption></figure> <figure><img src="/files/8251277a9adee315c81ba53744e5d2122b2c80ef" alt=""><figcaption></figcaption></figure></div>

4. Couleur du texte du bouton : si vous remplissez le champ vide pour le texte affiché sur l’icône du widget, vous pourrez modifier la palette de couleurs du texte.

<figure><img src="/files/374addc70d9fdb4fd2e6354b59a2c3747d7cc27d" alt=""><figcaption></figcaption></figure>

5. L’animation du bouton permet d’améliorer l’apparence de votre site web et de le rendre plus vivant.

<figure><img src="/files/1616e68cd4002f865298288f1689413a4fbc9d18" alt=""><figcaption></figcaption></figure>

À quoi ressemble chaque animation de bouton :

<div><figure><img src="/files/75777c990defdae4598090ca31e851a651920e7f" alt="" width="188"><figcaption><p>Pulse</p></figcaption></figure> <figure><img src="/files/3b91d57188a09cf9fa8923e19cccd55bf94b3bca" alt="" width="188"><figcaption><p>Secousse</p></figcaption></figure> <figure><img src="/files/1668fcbb4f4280c78fbd95a94e796f85c04be53d" alt="" width="188"><figcaption><p>Ondulation</p></figcaption></figure></div>

### Paramètres du widget

Une fois les paramètres d’apparence du bouton configurés, passons au contenu et à l’apparence du widget lui-même.

<figure><img src="/files/9f645f49b344b7a95a88e410b5c2df32cf42f268" alt=""><figcaption></figcaption></figure>

Vous pouvez remplir les champs de texte à l’intérieur du widget :

1. Titre

<figure><img src="/files/1acf9167fc9dfd3c5f713be9a1bff6e3c9b40a92" alt=""><figcaption></figcaption></figure>

<figure><img src="/files/48c9969e9d98bd4190b8b0729a45dfc7f4bf071a" alt=""><figcaption></figcaption></figure>

2. Sous-titre

<figure><img src="/files/f22519ef6af117170db4665f73d99944feb730ac" alt=""><figcaption></figcaption></figure>

<figure><img src="/files/d7929dcde42bd1f5184680217890002d95764a32" alt=""><figcaption></figcaption></figure>

{% hint style="info" %}
Ce champ est obligatoire.
{% endhint %}

3. Texte du widget affiché après le démarrage du minuteur

<figure><img src="/files/b779b334f3e523ebd0be9bebe1d24ec474994095" alt=""><figcaption></figcaption></figure>

Le texte apparaîtra dans le widget seulement après que le client aura cliqué sur le bouton « Rappelez-moi » (ou sur tout autre texte de bouton) pendant le compte à rebours du minuteur.

Vous définissez le minuteur du widget à l’aide de ce paramètre :

<figure><img src="/files/cb4ef4a5416feac0f1c35e267dd720a48800c390" alt=""><figcaption></figcaption></figure>

4. Texte du bouton

<figure><img src="/files/40790df4886e08dc23f3b4d67972a0e31ce604a8" alt=""><figcaption></figcaption></figure>

Vous pouvez aligner le texte à l’intérieur du widget au centre, à gauche ou à droite à l’aide de ces boutons, comme dans n’importe quel éditeur de texte.

<figure><img src="/files/157b4b135c58771c71afb882b9a5e645aa370ba6" alt=""><figcaption></figcaption></figure>

À l’aide de la vaste palette de couleurs, vous pouvez ajuster la teinte ou le dégradé de l’arrière-plan, les couleurs des boutons, et même définir un motif.

<figure><img src="/files/6fca5a54c8cec9a7c1fa5a3de592279abb5764f6" alt=""><figcaption></figcaption></figure>

## Comment intégrer un widget sur votre site

Après avoir configuré tous les paramètres et personnalisé l’apparence du widget selon votre design unique, cliquez sur le **« Ajouter le widget »** bouton en bas de l’écran.

Vous serez redirigé vers la liste des widgets prêts à l’emploi, où vous devrez cliquer sur le **« Code d’intégration sur le site »** .

<figure><img src="/files/ed48c9d76af9a579a8001b4f49aedab9c92bbeba" alt=""><figcaption></figcaption></figure>

Ensuite, une fenêtre modale avec le script s’ouvrira.

<figure><img src="/files/be8f2ce77fa3d7ce9abe4f745940ff1946de0ab7" alt=""><figcaption></figcaption></figure>

Copiez le script et allez dans les paramètres du site web où vous avez saisi le domaine dans les paramètres du widget.

Ensuite, insérez le code dans le **en-tête HTML** section.

{% hint style="info" %}
Pour intégrer le widget sur un site web Tilda, copiez également le script du widget à l’aide du bouton « Code d’intégration sur le site web », puis installez-le sur le site.
{% endhint %}

C’est fait ! La configuration et l’installation du widget sur le site web sont maintenant terminées !

## Rappels

**Rappels disponibles :**

1. widget\_callback\_later widget\_id : 1 au 23.04.2024 18:00 - un rappel différé, où <mark style="color:green;">**widget\_callback\_later**</mark>  est le type de rappel ; <mark style="color:yellow;">**widget\_id : 1 au 23.04.2024 18:00**</mark> - indique l’ID du widget ainsi que la date et l’heure auxquelles l’appel doit être effectué auprès du client.
2. widget\_callback\_need\_call widget\_id : 1 au 23.04.2024 18:00 - indique que le client a besoin d’un appel, où\ <mark style="color:green;">**widget\_callback\_need\_call**</mark>  est le type de rappel ; <mark style="color:yellow;">**widget\_id : 1 au 23.04.2024 18:00**</mark> - affiche l’ID du widget et la date et l’heure programmées pour l’appel.
3. widget\_callback\_now widget\_id : 1 - rappel signalant le besoin immédiat d’appeler le client, où<mark style="color:green;">**widget\_callback\_now**</mark>  est le type de rappel ;  <mark style="color:yellow;">**widget\_id : 1**</mark>   est l’ID du widget ;
4. widget\_callback\_need\_call - rappel indiquant qu’un appel est nécessaire. Ce rappel est envoyé si le paramètre correspondant est activé.
5. widget\_callback\_now - rappel indiquant l’appel en cours.


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.mavibot.ai/doc/fr/websites/widgets/widget-de-rappel.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
