Cliquez sur le bouton "Paramètres" du panneau supérieur pour accéder aux paramètres généraux de la page.

Cela ouvre un menu avec les sections suivantes : Général, Messageries, Analytique, Couleurs, Polices et HTML.

Général

Informations sur la page

Nom dans la liste

Vous pouvez saisir n'importe quel texte ici. Ce nom n'est visible que par vous dans la liste des pages.

URL

Ce champ vous permet de définir un lien personnalisé (URL) pour la page. S'il est laissé vide, un nom unique sera automatiquement généré à partir de lettres et de chiffres.

Exigences :

Seuls les caractères suivants peuvent être utilisés :

  • Lettres latines (a–z)
  • Chiffres (0–9)
  • Tiret bas (_)

Le nom doit être unique au sein de la plateforme. S'il est déjà utilisé par un autre utilisateur, vous ne pourrez pas l'utiliser à nouveau.

Vous pouvez connecter votre propre domaine au site web.
Si vous ne pouvez pas modifier le nom dans le lien, cela signifie que le nom est déjà pris.
Vous pouvez ajouter des caractères supplémentaires ou en choisir un autre.

Nom de l'onglet du navigateur

Par défaut, le nom de l'onglet du navigateur correspond au champ nom du site, mais vous pouvez le personnaliser pour le rendre plus concis ou descriptif.

Le nom de l'onglet du navigateur s'affiche dans la barre d'adresse de la page.

Balise

Une balise est une étiquette envoyée à votre bot au moment où un utilisateur clique sur l'icône de messagerie. Elle vous permet de lancer des flux de bot spécifiques instantanément, sans attendre le premier message de l'utilisateur.

Saisissez le nom de la balise dans le champ "Déclencheur" d'un bloc déclencheur.

La balise est attribuée dans les paramètres de la page.

La valeur spécifiée dans le champ Balise sera enregistrée dans la variable tag du client. Cette variable peut ensuite être utilisée à des fins d'analyse.

Un message contenant cette balise déclenchera une action spécifique dans l'entonnoir de votre bot, comme l'envoi d'une réponse ou le passage à l'étape suivante.

Saisissez une balise, par exemple : welcome_offer

La balise enregistrée sera visible dans le panneau d'informations de la page.

Comment utiliser une balise de messagerie

Tout d'abord, attribuez une balise comme main_flow dans les paramètres de votre site. Ensuite, saisissez cette balise exacte dans le bloc déclencheur de votre chatbot.

Définir un point d'entrée de chat

Définissez un bloc spécifique (par exemple, le début de votre entonnoir principal) comme point d'entrée pour la logique de votre bot. Lorsqu'un utilisateur clique sur l'icône de messagerie sur votre site, il entre dans la messagerie et commence immédiatement à ce point prédéfini.

Pour configurer les blocs de formulaire et les boutons de redirection de messagerie, reportez-vous au guide "Réponses aux formulaires" dans Paramètres de contenu.

Lorsqu'un utilisateur clique sur le bouton, il est invité à se rendre directement dans la messagerie.

  • L'utilisateur passe du site web à la messagerie.
  • L'utilisateur appuie sur le bouton "Démarrer" ou "Lancer" (selon l'appareil). Même si l'utilisateur a déjà interagi avec le bot, il doit appuyer sur ce bouton pour lancer le bot depuis le site web — il s'agit d'une exigence de la plateforme de messagerie pour les bots.
  • Au lieu de /start, le bot recevra la balise spécifiée dans les paramètres du site web.
  • Le client reçoit le premier message de l'entonnoir déclenché par la balise spécifiée.
  • Le profil du client contient la variable suivante :

Pour afficher les analyses d'une balise, allez dans la section "Analytique" et ouvrez l'onglet "Clients".

Ensuite, créez un nouveau widget où vous spécifiez les paramètres principaux :

  • Période d'analyse : par exemple, "Mois dernier", "Tout le temps", etc. ;
  • Nom du widget : tout nom pratique ;
  • Spécifiez une balise à suivre.

Ensuite, ajoutez un widget.

Terminé ! Vous pouvez maintenant suivre la fréquence à laquelle votre bot est lancé depuis votre site à l'aide d'une balise.

L'analyse intégrée de MaviBot vous permet de suivre les chats, l'efficacité des opérateurs, la progression des cours et les métriques des clients sans frais, éliminant ainsi le besoin d'outils externes.

En savoir plus dans l'article "Analyse MaviBot".

Paramètres d'image

Image d'aperçu

Il s'agit de l'image miniature ou de couverture utilisée lorsque votre site est partagé (par exemple, sur les réseaux sociaux ou les applications de messagerie). Par défaut, elle utilise la première image de votre page. Pour définir un aperçu personnalisé, téléchargez l'image de votre choix dans ce champ.

Paramètres de protection du site / reCAPTCHA

Pour configurer reCAPTCHA, vous devez fournir une paire de clés (clés publique et secrète) dans les paramètres généraux de votre site web, et activer la vérification reCAPTCHA dans vos paramètres de formulaire.

Vous pouvez choisir n'importe quel service CAPTCHA pour protéger votre site web. Dans cette section, nous verrons comment installer Google reCAPTCHA.

  1. Obtention des clés

Pour commencer, vous devez remplir les informations de base pour obtenir les clés : sélectionnez les types de CAPTCHA et ajoutez le domaine du site web où la protection doit être installée. Ensuite, cliquez sur "Soumettre".

  1. Saisie des clés

Ensuite, vous verrez une paire de clés que vous devez copier et coller dans les paramètres de la page sur votre site web dans MaviBot.

  1. Activation du CAPTCHA dans la section "Formulaire"

La création et l'utilisation de la section "Formulaire" sont expliquées dans l'article ici.

Une fois la section Formulaire configurée, ouvrez ses paramètres.

Cliquez sur "Paramètres" pour ouvrir le menu latéral.

Une case à cocher d'activation du CAPTCHA y sera visible.

Authentification

Cette option permet de filtrer les utilisateurs qui tentent d'accéder au site sans autorisation. Cependant, il est préférable de l'activer après avoir configuré tout le reste et être sûr que la configuration est correcte. Une fois activée, le seul moyen d'accéder au site sera via le bouton d'autorisation envoyé par le bot.

Commençons par lier le domaine au bot Telegram connecté à votre projet.

Étape 1 : Allez dans BotFather, où vous avez créé votre bot Telegram.

Étape 2 : Sélectionnez le bot Telegram que vous souhaitez connecter au site web et cliquez dessus.

Étape 3 : Allez dans les paramètres du bot Telegram.

Étape 4 : Dans les paramètres du bot, accédez à Domaine.

Étape 5 : Cliquez sur "Définir le domaine".

Si vous avez déjà lié un domaine au bot, ou si vous devez définir un nouveau domaine pour le même bot, le bouton "Définir le domaine" sera remplacé par "Réinitialiser le domaine".

Étape 6 : Envoyez un domaine que vous souhaitez lier au bot Telegram : pour ce faire, tapez le domaine dans le champ de saisie du message et envoyez-le au bot.

Cela peut être soit votre domaine personnel, que vous avez reçu d'un registraire de noms de domaine, soit quelque chose comme mavitbot.ai

À ce stade, la liaison du domaine est terminée.

Après avoir lié le domaine au bot, activez la case à cocher "Exiger une autorisation via Telegram" dans les paramètres du formulaire :

Paramètres d'interface et d'accès

Accès par listes uniquement

Cette option vous permet de fournir un accès au site en fonction de la présence de l'utilisateur dans certaines listes de votre projet.

Comment masquer le label "Créé avec MaviBot"

Pour masquer le label, cochez simplement cette case si nécessaire.

Vous pouvez supprimer le label "Créé avec MaviBot" sur n'importe quel plan payant. Nous apprécions tous ceux qui conservent le label "Créé avec MaviBot" sur leurs pages.

HTML/CSS/JS

Vous pouvez remplir cette section si nécessaire.
Si vous connaissez le CSS, vous pouvez rendre votre site web encore plus attrayant visuellement. Vous pouvez également insérer ici un code d'analyse, un pixel Facebook, etc.

VEUILLEZ NOTER !
Lorsque vous copiez des exemples de scripts, assurez-vous que si une balise est ouverte, elle doit également être fermée.
Par exemple : <script> ... </script>, <style> ... </style>

Comment modifier le lien de la politique de confidentialité

Dans le bloc de formulaire de demande avec des boutons de messagerie, vous pouvez afficher une case à cocher de politique de confidentialité.
Par défaut, elle renvoie à la politique de confidentialité du constructeur.

Vous pouvez modifier le lien vers votre propre page de politique de confidentialité à l'aide d'un script.

Ajoutez le script dans le champ "Code HTML (body)" de la section CSS et JS.

<script>
document.getElementsByClassName('mavibot-privacy__link')[0].href = "lien de la politique de confidentialité";
</script>

Comment désactiver l'indexation de la page

Pour désactiver l'indexation de la page, ajoutez le script dans le champ Code HTML (head).

<meta name="robots" content="noindex, nofollow">

Comment supprimer le bouton Facebook de votre page de site

Ajoutez le script dans le champ "Code HTML (body)" de la section CSS et JS.

<script>
document.getElementsByClassName('vk_link')[0].remove()
</script>

Comment supprimer le titre de votre page de site

Ajoutez le script dans le champ "Code HTML (body)" de la section CSS et JS.
Cela s'applique aux anciennes versions des mini-landing pages.

<script>
document.getElementsByClassName('title_container')[0].remove()
</script>

Comment modifier le lien du bouton Telegram.

Ajoutez le script dans le champ "Code HTML (body)" de la section CSS et JS.

<script>
window.onload = function() {
    let button = document.querySelector('.tg_link')
    if (button) {
        button.setAttribute('data-url', 'la valeur requise')
        button.removeAttribute('onclick')
        let newUrl = button.getAttribute('data-url')
        button.addEventListener('click', () => {
            window.location.href = newUrl
        })
    }
}
</script>

Pour les autres messageries, remplacez tg_link par insta_link, fb_link, etc.

Comment mettre à jour le texte d'un bouton

Collez ce code dans le champ "Code HTML (body)" de la section CSS et JS.

  1. Pour afficher le bouton de messagerie, créez un bloc de formulaire de demande avec des questions et spécifiez pour quelles messageries les boutons doivent apparaître

Définissez le style d'affichage du bouton sur "Icône avec texte"

Plus de détails sur la section Formulaire sont expliqués ici. lien

  1. Dans la section Paramètres du site, sous l'onglet CSS et JS, collez le code suivant dans le champ "Paramètres HTML" → "Code HTML (body)" :

Ce code modifiera le texte du bouton pour Telegram et Viber. Pour les autres messageries, ajoutez un code similaire en suivant l'exemple.

Comment aligner les boutons en ligne

Collez le script suivant dans le champ "Code JS" des paramètres principaux de votre mini-landing page.

$(function() {
$('.link_group').css("flexWrap", 'noWrap')
})

Comment changer un favicon

Ajoutez le script dans le champ "Code HTML (head)" de la section CSS et JS.

Ce code peut être utilisé pour changer le favicon — l'icône d'un site web ou d'une page web.

Comment transmettre toutes les variables/paramètres d'URL lors de l'ouverture de votre site web

Vous devez placer le script sur toutes les pages de VOTRE site web qui contiennent un lien proxy. Le script doit être ajouté juste après la balise <body>.

Si vous utilisez votre propre domaine pour les liens proxy, vous devez remplacer sbsite.pro par votre domaine.

Si votre site web contient des liens proxy vers des messageries depuis la page du site, vous pouvez ajouter ce script — il transmettra toutes les variables utilisées pour ouvrir le site au bot.

<script>
var links = document.getElementsByTagName("a")
for (let i of links) {
    if (i.href.startsWith("https://mavibot.site/")) {
        if (i.href.split("?").length > 1) {
            i.href += "&" + location.search.split("?")[1]
        } else {
            i.href += location.search
        }
    }
}</script>

Comment transmettre les cookies d'analyse au bot

Le script doit être placé sur toutes les pages de VOTRE site web qui contiennent un lien proxy. Il doit être ajouté juste après la balise <body>.

Si vous utilisez votre propre domaine pour les liens proxy, vous devez remplacer mavibot.ai par votre domaine.

Si vous devez transmettre des cookies d'analyse au bot, ajoutez le script suivant à votre site :

<script>
setTimeout(function() {
    var links = document.getElementsByTagName("a");
    var cookies = ['_fbc', '_fbp', '_ga', '_ym_uid', 'roistat_visit'];
    var cookies_string = '';

    cookies.forEach(function(cookie_name){
        let cookie_val = get_cookie(cookie_name);
        if (cookie_val !== undefined) {
            cookies_string += (cookies_string != '' ? "&" : '') + cookie_name + "='" + cookie_val + "'";
        }
    });

    for (let i of links) {
        if (i.href.startsWith("https://salebot.site/")) {
            if (i.href.split("?").length > 1) {
                i.href += "&" + cookies_string;
            } else {
                i.href += "?" + cookies_string;
            }
        }
    }

    function get_cookie(name) {
        let matches = document.cookie.match(new RegExp("(?:^|; )" + name.replace(/([\.$?*|{}\(\)\[\]\\\/\+^])/g, '\\$1') + "=([^;]*)"));
        return matches ? decodeURIComponent(matches[1]) : undefined;
    }
}, 3000);
</script>

Comment modifier le lien de la politique de confidentialité

Sur l'onglet CSS et JS, collez le code suivant dans le champ "Paramètres HTML" → "Code HTML (body)" :

Ce script vous permet de remplacer le lien de la politique de confidentialité par le vôtre.

<script>
document.getElementsByClassName('mavibot-privacy__link')[0].href = "lien de la politique";
</script>

Messageries

Message WhatsApp initial

Le texte que vous saisissez ici apparaîtra automatiquement comme un brouillon dans WhatsApp lorsque l'utilisateur clique sur le lien depuis votre site.

Ils peuvent simplement appuyer sur "Envoyer" dans la messagerie.

  1. Créez un bloc "Démarrer" dans le constructeur.
  2. Saisissez le texte de votre message initial dans ce bloc.

Analytique

Activez le paramètre "Enregistrer les données d'analyse pour la conversion" pour conserver le suivi des conversions de votre site.

Cela vous permettra de surveiller les conversions dans l'onglet Analytique.

Exportation du site web / Importation de page

Le constructeur de site web vous permet d'exporter et d'importer des pages entières. Cela est utile pour transférer un site entre projets sans le reconstruire, tout en conservant tout le contenu.

Comment exporter/importer une page :

  1. Tout d'abord, assurez-vous que toutes vos modifications sont enregistrées en cliquant sur le bouton "Enregistrer".

Cliquez sur "Exporter la page" dans l'éditeur pour exporter votre page.

Une fois le fichier téléchargé (vous le verrez dans votre dossier de téléchargements et recevrez une confirmation), allez dans les paramètres du site de votre projet cible. Là, cliquez sur "Créer" pour créer une page identique.

Sélectionnez le fichier de page exporté que vous avez enregistré précédemment. Une fois le téléchargement confirmé par une notification, vous serez directement redirigé vers l'éditeur pour commencer à travailler sur la page importée.

Si nécessaire, effectuez les ajustements requis et cliquez sur le bouton "Enregistrer".

Où trouver l'ID de la page ?

L'ID de la page du site depuis la liste des sites peut être transmis aux fonctions du bot — par exemple, pour envoyer un lien vers votre site via le bot ou pour l'ouvrir en tant que mini-application dans Telegram.

En savoir plus sur Telegram WebApp dans cet article.

Le numéro du site est attribué automatiquement avec le symbole #.

Vous pouvez trouver l'ID de la page en survolant la page du site souhaitée.