Écran d’accueil du chat : message, logo, tuiles et onglets

L’écran d’accueil est la première chose que voit un visiteur à l’ouverture du chat : un message d’accueil, votre logo, un en-tête coloré et jusqu’à dix tuiles. En dessous, il passe entre les onglets Accueil, Messages et Aide. Sans écran d’accueil, le chat s’ouvre directement sur la conversation.

Les réglages se trouvent sous /app/projects/{id}, dans l’onglet Apparence, section Écran d’accueil du widget.

L’aperçu en direct

À côté du formulaire fonctionne le vrai widget, alimenté par vos saisies. Ce que vous écrivez apparaît immédiatement dans l’aperçu. Rien n’est enregistré par celui-ci ; seul le bouton Enregistrer applique la modification. Après l’enregistrement, il faut jusqu’à une minute pour que vos visiteurs la voient.

L’onglet Aide manque dans l’aperçu : il dépend des articles publiés de votre centre d’aide, que le widget récupère depuis votre propre domaine. Il est présent sur votre site.

Les options

• Afficher l’écran d’accueil – désactivé (par défaut) : le chat s’ouvre directement sur la conversation, sans barre d’onglets. Activé : le chat commence sur l’écran d’accueil.
• Afficher l’onglet Aide – affiche les articles publiés de votre centre d’aide avec une recherche. L’onglet n’apparaît que si le centre d’aide possède une adresse et au moins un article publié. La configuration du centre d’aide est décrite dans le manuel du produit.
• Afficher le dernier message sur l’écran d’accueil – activé (par défaut) : les visiteurs récurrents retrouvent leur dernier échange et accèdent à la conversation en un clic.
• Afficher le bouton « Parler à l’équipe » sous le champ de message – activé (par défaut). Le bouton apparaît pendant que l’assistant IA répond. Lorsqu’aucun membre de votre équipe n’est en ligne, il indique « Laisser un message à l’équipe ».

Logo, couleurs et message d’accueil

• Logo sur l’écran d’accueil – une adresse commençant par https://, ou une image sous forme de data:image/…. Au maximum 255 caractères. Une valeur vide signifie aucun logo ; seul le message d’accueil apparaît alors.
• Dégradé de l’en-tête, depuis et jusqu’à – deux couleurs pour l’en-tête coloré de l’écran d’accueil. Sans valeur, le widget utilise votre couleur de marque (voir Couleurs, police et thème).
• Message d’accueil – la grande ligne en haut. Une valeur vide signifie notre texte traduit (« Bonjour 👋 »).
• Ligne en dessous – la ligne plus petite. Une valeur vide signifie « Comment vous aider ? » dans la langue du visiteur.

Vous rédigez le message d’accueil, la ligne en dessous et les textes des tuiles dans la langue par défaut du projet (Installation → Données de base). Au maximum 400 caractères par texte. Ils ne possèdent pas de traduction distincte par langue : votre saisie est aussi visible par les visiteurs dont le widget utilise une autre langue. Rédigez donc l’écran d’accueil dans la langue lue par la plupart de vos visiteurs. Si vous laissez le message ou la ligne en dessous vide, notre texte apparaît dans la langue du visiteur.

Le style de l’en-tête (dégradé, uni ou verre) et la densité de l’écran d’accueil se règlent sous Apparence → Marque → Style ; voir Fenêtre de chat : style, taille et panneau latéral.

Tuiles

Les tuiles sont de grands boutons sur l’écran d’accueil. Vous pouvez en créer jusqu’à dix. Une tuile sans titre n’apparaît pas ; c’est aussi la manière de la supprimer : effacez le titre et enregistrez.

Chaque tuile possède :

• Comportement – l’effet du clic :
• aller à la conversation – ouvre la conversation. Si Cible contient une phrase, elle est écrite dans le champ de saisie du visiteur. Elle n’est pas envoyée.
• ouvrir un lien – ouvre l’adresse de Cible. Elle doit commencer par https://, sinon elle n’est pas enregistrée.
• ouvrir l’aide – passe à l’onglet Aide.
• laisser un message – ouvre le formulaire pour un message par e-mail.
• Titre – obligatoire, sinon la tuile n’apparaît pas.
• Ligne en dessous – facultative.
• Cible – selon le comportement, l’adresse ou la phrase préremplie, 200 caractères maximum.

L’écran d’accueil entier (tuiles, textes et carte promotionnelle réunis) ne doit pas dépasser 16 KB à l’enregistrement. Dix tuiles avec titre et seconde ligne restent bien en dessous. Si la taille est excessive, votre compte indique la raison au lieu d’omettre silencieusement des éléments.

Carte promotionnelle

Sur l’écran d’accueil et/ou en haut de la conversation, vous pouvez afficher une carte pour votre offre, par exemple votre forfait payant. Elle figure sous Apparence → Carte promotionnelle et possède son propre guide : La carte promotionnelle dans le chat. Pour l’emplacement « écran d’accueil », celui-ci doit être activé.

Choisir un onglet à l’ouverture

Vous pouvez définir par lien ou par appel l’onglet affiché au premier plan à l’ouverture du chat, avec data-rc-tab ou l’option tab :

<a href="#rc-open" data-rc-tab="help">Browse help articles</a>

ReactiveChat('open', { tab: 'home' });

Les valeurs autorisées sont home (écran d’accueil), msg (conversation) et help (aide). Si l’onglet n’existe pas, le chat s’ouvre simplement comme d’habitude. Plus de détails dans Ouvrir le chat depuis votre propre lien ou bouton.

Si un élément n’apparaît pas

• Aucune barre d’onglets : Afficher l’écran d’accueil est-il coché et enregistré ?
• Aucun onglet Aide : votre centre d’aide possède-t-il une adresse et au moins un article publié ?
• Une tuile manque : possède-t-elle un titre ?
• Le logo manque : l’adresse commence-t-elle par https:// ou data:image/ ?

Vous pouvez modifier les textes des onglets (« Accueil », « Messages », « Aide ») et des tuiles intégrées sous Textes et langues.