# Boutons avec un lien

## Comment créer un bouton avec un lien

Pour que le bot affiche des boutons avec des liens aux clients, lors de la création (ou de la modification) d’un bouton, vous devez :

Étape 1. Créez un bouton et sélectionnez le type **"Par défaut"**:

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

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

Étape 2. Dans le **URL** champ, saisissez :

a) un lien direct :

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

b) Une variable qui contient un lien :

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

Le clic sur le bouton ouvrira l’URL spécifiée dans ses paramètres.

{% hint style="warning" %}
Remarque !&#x20;

Chaque messagerie a ses spécificités. Par exemple, dans Telegram et Instagram, vous ne pouvez ajouter un lien qu’à un **bouton inline** (boutons dans le texte).

<img src="/files/491824c40427775e0e3ae1dfd1a8e3744572f546" alt="" data-size="original">
{% endhint %}

## Notification de clic

Pour suivre quand un client clique sur un lien ou un bouton et configurer les actions suivantes, utilisez la **« Notification de clic »** case à cocher dans les paramètres du bouton.

<div data-with-frame="true"><figure><img src="/files/3b24b124ab331fbc5df0ac5b6d7e880b63c7b447" alt="" width="563"><figcaption></figcaption></figure></div>

Cochez la case pour recevoir des callbacks (notifications d’événement) lorsqu’un client clique sur le bouton :

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

Ensuite, cliquez sur **« Modifier »** ou **"Ajouter"** (selon que vous modifiez un bouton existant ou que vous en créez un nouveau).

### Exemple

Testons le bouton. Après avoir cliqué dessus, vous devriez voir une invite pour suivre le lien.

<div data-with-frame="true"><figure><img src="/files/5ca2e219817ad4a491635a62f9141d8d3764a3e4" alt="" width="375"><figcaption></figcaption></figure></div>

{% hint style="info" %}
Le callback ne sera pas reçu tant que le client n’aura pas cliqué **« en savoir plus »**.
{% endhint %}

Si le client suit le lien, un callback du formulaire suivant apparaîtra dans la **section Clients** section dans le dialogue du client :\
`link_was_pressed #{URL}`, où `link_was_pressed` est le corps du callback (événement dans le projet), et `#{URL}` est votre lien.

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

Pour configurer une réaction au callback, créez un bloc de déclenchement dans lequel vous spécifiez le callback dans le champ du déclencheur, ou spécifiez le callback dans le déclencheur de connexion :

**Option 1.** Créez un bloc de déclenchement qui ne se déclenchera que si le callback est reçu :

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

{% hint style="info" %}
Dans cet exemple, nous avons utilisé le **« Déclencheur »** bloc — il ne se déclenchera également que si le callback spécifié est reçu, mais il ne retirera pas le client de l’entonnoir principal.<br>

Vous pouvez également utiliser un autre bloc de déclenchement.
{% endhint %}

{% hint style="success" %}
Veuillez noter !

Le constructeur a une limite de 500 blocs de déclenchement par projet.
{% endhint %}

**Option 2 :** Utiliser un déclencheur de connexion

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

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

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

Bien que les deux nécessitent le callback pour se déclencher, ils affectent le flux différemment :

* **Option 1 (bloc de repli) :** Conserve l’utilisateur dans le même état.
* **Option 2 (connexion) :** Fait passer l’utilisateur à l’étape suivante de l’entonnoir.


---

# 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/chatbot/builder/boutons/boutons-avec-un-lien.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.