Passer au contenu principal

Personnalisez votre Help Center

Comment personnaliser votre Help Center et gérer les options de personnalisation.

Écrit par Beth-Ann Sher

Dans les paramètres du Help Center, vous trouverez de nombreuses options de personnalisation pour vous aider à marquer votre Help Center et contrôler son apparence pour vos clients. Voici comment configurer et prévisualiser les modifications d'un Help Center en temps réel.


Paramètres généraux

Pour configurer les langues supportées du Help Center, les domain, l'Analytics, la confidentialité et les images des réseaux sociaux, allez dans Paramètres > Help Center. Cliquez sur le Help Center que vous souhaitez configurer, puis sur Configurer et styliser dans le coin droit.

Ensuite, ouvrez l'onglet Général. 👇

Si vous utilisez Multi Help Center, vous pouvez configurer les paramètres pour chaque Help Center séparément.

Langues supportées

Pour choisir une langue par défaut, allez dans Paramètres > Help Center > Configurer & Styliser, cliquez sur l'onglet Général et ouvrez Langues supportées.

Sélectionnez ensuite votre langue par défaut et cliquez sur Enregistrer et mettre en ligne.

Une fois que vous avez choisi votre Langue par défaut, l'interface utilisateur de votre Help Center s'affichera dans la langue que vous avez définie. Cela changera la langue de :

  • L'invite de recherche sur votre page d'accueil.

  • Le nombre d'articles, l'auteur et la date de dernière modification.

  • L'invite de réactions sur vos articles.

  • Le logo « We run on Intercom » et plus encore.

Note :

Même si votre Help Center ne supporte qu'une seule langue, il y aura toujours une option déroulante affichant une seule langue et il n'est pas possible de la supprimer.

Domaines

Utilisez votre domain par défaut

Lorsque vous mettez votre Help Center en ligne, nous rendons votre contenu disponible via un domain Intercom par défaut. Assurez-vous donc d'abord que votre Help Center est mis en ligne.

Ensuite, allez dans Paramètres > Help Center > Configurer & Styliser, cliquez sur l'onglet Général et ouvrez Domaines pour obtenir votre "URL par défaut du Help Center".

Le nom de votre application fera partie de votre URL. Par exemple, si le nom de votre application est « ExampleApp », votre URL ressemblera à ceci :

Vous pouvez modifier la partie nom de l'application de votre URL (par exemple exampleapp) comme vous le souhaitez.

Définir un domain personnalisé

Si vous préférez rendre votre contenu disponible via votre propre domain, vous pouvez configurer un domain personnalisé.

Allez chez votre fournisseur DNS (par exemple GoDaddy, Cloudflare, DNSimple ou Route53, etc.) et créez un enregistrement CNAME avec un hôte cible de custom.intercom.help. Nous avons créé ce guide pour vous aider, vous ou votre ingénieur, à configurer cela.

Note :

  • Les sous-domaines (par exemple help.exampleapp.io) et les sous-chemins (par exemple exampleapp.io/help) sont pris en charge.

  • Les modifications DNS peuvent prendre jusqu'à 72 heures pour être effectives, mais elles se produisent généralement beaucoup plus rapidement.

Ensuite, allez dans Paramètres > Help Center > Configurer & Styliser et ouvrez Domaines pour saisir l'URL de votre domain personnalisé du Help Center et cliquez sur Enregistrer et mettre en ligne.

Vous pouvez également choisir de désactiver l'indexation par les moteurs de recherche et garder vos articles privés.

Analytics

Pour intégrer Google Analytics à votre Help Center et obtenir des informations sur le comportement de vos visiteurs, vous avez juste besoin de votre ID de mesure GA4.

Une fois que vous avez copié votre ID de mesure GA4 depuis votre compte Google Analytics, allez dans Paramètres > Help Center > Configurer & Styliser et ouvrez Analytics, puis collez-le sous "ID de suivi Google Analytics".

Confidentialité

Pour restreindre les articles aux utilisateurs connectés uniquement, définissez l'audience de l'article sur Users dans le panneau Détails de l'article. Une fois qu'un article est défini sur Users, il n'est visible que par les personnes connectées à votre produit — les visiteurs et leads ne le verront pas dans votre Help Center ou dans les résultats de recherche. Allez dans Paramètres > Help Center > Configurer & Styliser et ouvrez Privacy pour saisir un lien vers votre page de connexion.

Lorsqu'un visiteur ou un lead tente d'accéder à un article restreint (défini uniquement pour Users), il sera redirigé vers l'URL de la page de connexion que vous avez saisie ici, avec une invite l'encourageant à se connecter. Sans URL de page de connexion, aucune redirection ne se produira.

Il n'est pas possible de rendre le Help Center lui-même privé. Les clients pourront toujours accéder à votre Help Center si vous rendez tous vos articles privés, mais ils ne pourront voir aucun article tant qu'ils ne se seront pas connectés.

Images des réseaux sociaux

Favicon

Depuis Paramètres > Help Center > Configurer & Styliser > Général > Images des réseaux sociaux, vous pouvez télécharger un favicon. Ce favicon apparaît avant le titre sur l'onglet du navigateur de vos clients lorsqu'ils visitent le site web de votre Help Center.

Note : Sur la page d'accueil du Help Center, le titre de l'onglet du navigateur inclut automatiquement un préfixe généré par le système avant le nom de votre site (par exemple « Accueil | » (pour l'anglais)). Ce préfixe ne peut actuellement pas être supprimé ou personnalisé par les membres de l'espace de travail.

Ratio recommandé : 1:1. 150 Ko max, 588x588 maximum.

Image des réseaux sociaux

Vous pouvez également télécharger une image des réseaux sociaux en haute résolution. L'image des réseaux sociaux apparaît lorsque votre Help Center ou vos articles sont partagés sur Facebook, Twitter ou toute autre plateforme sociale.

Ratio recommandé : 1,91:1, 2 Mo, dimensions 1200 x 630.

Supprimer Help Center

Cette option est disponible uniquement lorsque vous avez multiple Help Centers, vous ne pouvez pas supprimer votre Help Center original (par défaut) de votre espace de travail.

Si c'est votre seul Help Center et que vous souhaitez le supprimer, vous pouvez le définir comme Non actif à la place.

Si vous supprimez un Help Center, il n'y a aucun moyen de le restaurer.


Paramètres de style

Pour gérer le style de votre Help Center et l'apparence du contenu sur la page d'accueil, les collections, les articles, l'en-tête et le pied de page, allez dans Paramètres > Help Center > Configurer & Style et ouvrez l'onglet Style.

Si vous utilisez Multi Help Center, vous pouvez configurer les paramètres de style pour chaque Help Center séparément.

Importer votre marque

Allez dans Paramètres > Help Center > Configurer & Style, cliquez sur Style et ouvrez Importer votre marque pour saisir l'URL de votre marque. Intercom stylisera automatiquement votre Help Center pour qu'il ressemble à votre marque.

Une fois la marque importée, nous appliquons automatiquement le logo et les couleurs de celle-ci.

Vous devrez fournir l'URL correcte lors de l'importation de votre marque. En général, il s'agit du domaine de premier niveau de votre site web. Par exemple, « example.com » plutôt que « subdomain.example.com ». Certains domaines ne sont pas accessibles ou ne fonctionnent pas, et dans ce cas, vous verrez un message d'erreur.

Vous verrez également les couleurs importées à côté de toutes les options de couleur dans la section Bloc héros. Cela vous permet de modifier facilement les couleurs des différentes parties du Help Center, sans perdre l'accès aux couleurs de votre marque.

Assurez-vous de cliquer sur Enregistrer et mettre en ligne, car vos modifications ne seront pas enregistrées automatiquement.

Ajouter une image héros

Si vous choisissez d'inclure une image héros, il est important de noter que l'image est responsive. Cela signifie qu'elle s'adaptera automatiquement pour remplir toute la zone de l'en-tête. Pour éviter que votre image soit recadrée ou étirée, vous devrez faire correspondre le ratio d'aspect de votre image à la hauteur d'en-tête choisie.

Dimensions et ratios recommandés

Utilisez ce tableau pour vous assurer que votre image correspond à la hauteur d'en-tête que vous avez sélectionnée dans vos paramètres :

Taille de l'en-tête

Hauteur

Ratio d'aspect recommandé

Dimensions d'exemple

Petit

245px

6:1

1470 x 245px

Moyen

360px

4:1

1440 x 360px

Grand

480px

3:1

1440 x 480px

Éléments partagés

Couleur de fond du corps

Allez dans Paramètres > Help Center > Configurer & Style, cliquez sur l'onglet Style et ouvrez Éléments partagés pour changer la couleur de fond du corps et toutes les pages du Help Center (accueil, collection, article, recherche, pages d'erreur, etc.) s'adapteront en conséquence.

Couleur d'action

Ensuite, définissez une couleur d'action qui contraste bien avec la couleur de fond du corps car elle sera utilisée dans les boutons, liens et autres éléments.

Note :

  • La couleur d'action ne sera pas mise à jour pour les icônes téléchargées au format JPEG/PNG/GIF.

  • La couleur sera mise à jour une fois que votre Help Center sera publié.

Style de design

Choisissez entre le style de design Carte ou Flottant qui s'applique aux Collections et Articles sur toutes les pages.

Lorsque vous choisissez le style de design carte, la couleur de fond de la carte sera générée automatiquement pour fournir un contraste suffisant avec la couleur de fond du Help Center. La couleur de fond de la carte ne peut pas être personnalisée.

Rayon des coins

Ensuite, définissez le rayon des coins pour les éléments de vos Collections, Articles et états au survol (lors du survol des Articles dans une Collection).

Police

Choisissez parmi une liste de polices Google préchargées à utiliser dans votre Help Center :

  • Police principale - Utilisée dans le message de bienvenue, les titres et en-têtes.

  • Police secondaire - Utilisée pour les descriptions, le corps des articles et tous les autres textes

Options de police disponibles

  • Amer

  • Inter

  • Lato

  • Lora

  • Montserrat

  • Open Sans

  • Oswald

  • Playfair Display

  • Poppins

  • Noto Sans

  • Noto Serif

  • Raleway

  • Roboto

  • Roboto Mono

  • Roboto Slab

Note :

  • La police sélectionnée ne s'applique pas au Messenger, qui utilisera toujours la police système.

  • La police que nous utilisions auparavant proxima nova a été supprimée en juin 2023 ; vous pouvez utiliser Montserrat ou Open Sans pour obtenir un rendu similaire.

Ou, cliquez sur Manage custom fonts pour télécharger votre propre police personnalisée qui correspond à votre style de marque.

Afficher les auteurs des articles

Afficher ou masquer les auteurs des articles sur la Homepage, Collections et Articles en allant dans Settings > Help Center > Configure & Style.

Cliquez sur l'onglet Styling et ouvrez Shared elements, puis faites défiler vers le bas pour activer ou désactiver « Afficher les auteurs des articles ».

En-tête

Depuis Settings > Help Center > Configure & Style, cliquez sur l'onglet Styling et ouvrez Header, pour concevoir la section d'en-tête supérieure avec votre logo, le titre de la page/nom de l'entreprise, et tous les liens d'en-tête.

L'en-tête peut également être configuré séparément pour toutes vos langues supportées.

Logo

Téléchargez une version haute résolution de votre logo.

Ratio recommandé : 5:1. 1 Mo max, largeur/hauteur maximale de 720 px.

Si vous ajoutez un logo à l'en-tête de votre Help Center, il remplacera le titre de la page. Si vous ajoutez un logo au pied de page de votre Help Center, il remplacera le titre de la page.

Liens d'en-tête

Vous pouvez ajouter jusqu'à 3 liens vers d'autres pages web, comme votre blog ou communauté.

L'en-tête poussera le reste du contenu vers le bas au lieu de se superposer au contenu.

Bloc héros

Le bloc héros est la grande bannière en haut de la page d'accueil de votre Help Center — la section contenant votre message de bienvenue et la barre de recherche. Il se trouve sous le Header (qui affiche votre logo et les liens de navigation) et au-dessus du reste du contenu de la page.

Message de bienvenue

Depuis Settings > Help Center > Configure & Style, cliquez sur l'onglet Styling et ouvrez Hero block pour ajouter des attributs utilisateur au message de bienvenue sur la page d'accueil de votre Help Center.

Il inclura l'attribut utilisateur si le client est connecté. Si le client est un visiteur ou lead (non connecté), la valeur de secours que vous avez définie s'affichera à la place. Par exemple, définir une valeur de secours « là » signifie qu'un visiteur verra « Bonjour là ! » plutôt qu'un message de bienvenue vide ou cassé.

Note :

Note : Le message de bienvenue du bloc héros ne peut pas être laissé vide. Le bloc héros est un composant clé de la page d'accueil du Help Center et affichera toujours un texte — si le champ du message de bienvenue est vide, un texte par défaut ou un texte de remplacement apparaîtra à sa place. Assurez-vous de définir un message de bienvenue pour contrôler ce que vos clients voient.

Arrière-plan

La couleur d'arrière-plan que vous choisissez sera appliquée à ces éléments :

  • Couleur de l'icône de l'avatar (lorsqu'aucune image n'est disponible).

  • Liens dans les articles.

  • La couleur et le dégradé de votre bloc héros, ou le téléchargement d'image.

  • Fondu d'arrière-plan (si vous utilisez un dégradé de couleur).

Actuellement, par défaut, tous les avatars sont transparents. Cependant, les avatars ne seront pas transparents :

  • Si l'avatar est affiché dans un groupe d'avatars (et que ce groupe n'inclut pas l'avatar Fin)

  • Si ce groupe d'avatars contient plus d'un avatar

Couleur du texte

La couleur du texte que vous choisissez sera appliquée à :

  • Liens dans le bloc Hero.

  • Texte dans la barre de recherche.

Image Hero rapport recommandé : 5:2. Taille du fichier max 2 Mo, largeur/hauteur maximale de 3000 px. Cela apparaît en haut de votre page d'accueil et sur chaque page de votre Help Center - ajoutez donc une image forte qui représente votre marque.

« Fade background » apparaît uniquement sur la page d'accueil du Help Center.

Hauteur

Choisissez une hauteur globale pour l'en-tête du Help Center sur la page d'accueil. Hauteur minimale de 245 pixels et hauteur maximale de 600 pixels.

Barre de recherche

Choisissez parmi trois tailles différentes de barre de recherche, puis sélectionnez l'alignement :

  • Vertical - gauche ou centre.

  • Horizontal - haut, centre ou bas.

Court

Moyen

Long

Rayon des coins

Vous pouvez également sélectionner un rayon des coins pour la barre de recherche. Minimum de 0 pixel et maximum de 30 pixels.

Disposition et sections

Depuis Paramètres > Help Center > Configurer & Style, cliquez sur l'onglet Style et ouvrez Disposition et sections pour concevoir l'affichage des Collections et choisir d'activer les sections pour Articles, Contenu et Tickets Portal sur la page d'accueil. Cliquez sur Modifier pour configurer chacune.

Section Collections

Note : Les Collections doivent avoir des articles publiés dans toutes les langues prises en charge pour leur Help Center. Si une Collection n'a qu'une version anglaise publiée, elle n'apparaîtra pas dans les paramètres de style, car ces paramètres sont universels pour toutes les langues du Help Center. Pour résoudre ce problème, accédez à la collection et assurez-vous d'avoir créé et publié au moins un article dans chaque langue prise en charge par votre Help Center.

Disposition

Choisissez entre une disposition à 1, 2 ou 3 colonnes.

Puis sélectionnez un style de carte Collections :

  • Classique - Le style actuel de la carte collection.

  • Visuel - Utilise un espace plus grand pour les icônes et images.

  • Compact - Affiche les informations les plus importantes en utilisant un minimum d'espace.

Lorsque vous cliquez sur un style de carte, un aperçu s'affiche automatiquement à droite.

Note : La disposition compacte des collections nécessite le plan Expert.

Tous les styles de carte sont réactifs et s'affichent parfaitement à toute résolution, y compris mobile, bureau et tablette, que vous pouvez également prévisualiser à droite en utilisant le menu déroulant et en sélectionnant l'option que vous souhaitez voir.

Conception

Utilisez des icônes, images ou uniquement du texte pour vos cartes Collection.

Si vous utilisez des icônes, vous pouvez changer les couleurs suivantes :

  • Couleur de l'icône : sélectionnez la couleur avec le sélecteur de couleur ou entrez un code hexadécimal.

  • Arrière-plan de l'icône :

    • Couleur - Sélectionnez la couleur avec le sélecteur de couleur ou entrez un code hexadécimal.

    • Image - Téléchargez une image.

    • Dégradé - Créez un dégradé avec jusqu'à trois couleurs en utilisant le sélecteur de couleur ou entrez un code hexadécimal.

Note :

  • Ratio recommandé : 1:1

  • Dimensions recommandées : hauteur/largeur maximale de 48 px

  • La sélection de conception détermine les options disponibles pour les mises à jour des Collections. Par exemple, sélectionner Images vous permettra de choisir des images téléchargées plutôt que des icônes lors des mises à jour des Collections individuelles.

Si vous utilisez des images, cela remplira l'arrière-plan de la carte collection, ce qui fonctionne très bien avec le modèle visuel.

Les cartes collection individuelles peuvent être stylisées avec des images en choisissant la collection dans un menu déroulant. Ou les styles peuvent toujours être appliqués à toutes les collections en choisissant l'option Toutes les collections dans le menu déroulant, ce qui écrasera tous les styles individuels.

Note :

  • La couleur de l'icône ne peut être modifiée que sur les icônes par défaut ou les icônes personnalisées que vous avez téléchargées au format SVG.

  • Les téléchargements SVG s'affichent en une seule couleur.

  • La couleur de fond est optionnelle et peut être désactivée.

Section Articles

Ajoutez une section Articles sur la page d'accueil de votre Help Center.

Une fois activé, cliquez sur Modifier pour sélectionner la locale de ces articles, choisissez le nombre de colonnes à afficher, donnez un titre à cette section, puis sélectionnez des articles dans votre Help Center. Vous pouvez sélectionner jusqu'à 12 articles publiés dans votre Help Center.

Note :

  • Pour chaque locale, vous ne pouvez sélectionner que des articles publiés qui ont la traduction dans cette langue.

  • Les articles avec des règles de audience targeting appliquées peuvent être sélectionnés et affichés ici, mais n'apparaîtront au client que s'ils correspondent aux règles d'audience.

  • L'aperçu n'affichera que les liens des articles pour la locale par défaut.

Section de contenu

Ajoutez une section de contenu personnalisable à la page d'accueil de votre Help Center. C'est un excellent endroit pour mettre en avant une nouvelle fonctionnalité, un webinaire ou un appel à l'action pour vos clients. Une fois activé, cliquez sur Modifier pour personnaliser la section de contenu.

Créez du contenu localisé en sélectionnant l'une de vos langues prises en charge.

Ajoutez un titre, une description et un bouton d'appel à l'action optionnels à la carte de contenu.

Puis faites défiler vers le bas pour styliser :

  • Design - Choisissez entre carte ou plein écran.

  • Arrière-plan - Sélectionnez une couleur, une image ou un dégradé.

  • Couleur du texte - Sélectionnez la couleur du texte pour le titre et la description.

Voyez comment la section de contenu apparaîtra sur la page d'accueil avec l'aperçu à droite. L'aperçu ne s'affichera que dans votre langue par défaut.

N'oubliez pas de sélectionner Enregistrer et mettre en ligne lorsque vous êtes prêt à ajouter la section de contenu à votre Help Center.

Portail Tickets

Le portail tickets peut être activé si vous utilisez les tickets Intercom et souhaitez fournir à vos organisations clientes une vue en temps réel de tous leurs tickets en un seul endroit.

Ordre

Pour afficher les Articles au-dessus ou en dessous de vos Collections sur la page d'accueil, utilisez simplement l'outil de glisser-déposer à côté de chaque section pour les réorganiser.

Page de collection

Descriptions de contenu

Depuis Paramètres > Help Center > Configurer & Style, cliquez sur l'onglet Style et ouvrez Page de collection pour afficher ou masquer les "Descriptions de contenu" sur chacune de vos collections. Masquer les descriptions facilite la lecture de vos articles, afficher les descriptions aide les clients à comprendre ce qu'ils peuvent attendre de cette collection.

Note : La section collections ne peut pas être désactivée comme les autres sections.

Page d'article

Table des matières

Depuis Paramètres > Help Center > Configurer & Style, cliquez sur l'onglet Style et ouvrez Page d'article pour activer ou désactiver une table des matières sur chaque article en utilisant les titres H1 ou H2 de vos articles.

Articles connexes

Vous pouvez également afficher jusqu'à 5 articles connexes sous chaque article dans votre Help Center.

Pied de page

Personnalisez l'apparence du pied de page de votre Help Center avec trois modèles possibles : simple, classique ou multi-niveaux. Personnalisez votre pied de page en téléchargeant un logo, en ajoutant jusqu'à 16 liens vers les réseaux sociaux, et en regroupant les liens du pied de page dans le modèle choisi pour une organisation facile.

Ce pied de page sera cohérent sur toutes les pages de votre Help Center (page d'accueil, collections, articles).

Sélection d'un modèle de pied de page

Depuis Paramètres > Help Center > Configurer & Style, cliquez sur l'onglet Style et ouvrez Pied de page où vous pouvez personnaliser complètement le pied de page de votre Help Center pour qu'il soit conforme à votre marque.

Contrôlez le lien subtil « Powered by Intercom » dans le pied de page de vos articles Help Center en naviguant vers Paramètres > Général.

Recherchez la section « Message d'attribution Intercom » et utilisez le bouton pour l'activer ou le désactiver.

Note : Ce bouton contrôle simultanément les e-mails sortants et les articles Help Center. Il n'est pas possible d'activer le lien vers le site Intercom dans l'un tout en le désactivant dans l'autre.

Dimensions des images du News Center

Utilisez ces dimensions recommandées lors du téléchargement d'images dans votre News Center.

Logo

Ratio recommandé : 5:1.

Image d'en-tête

Ratio recommandé : 5:2. Pour un rendu net sur les grands écrans, visez environ 3000 × 1200px.

Favicon

Ratio recommandé : 1:1. 150KB max.



Aperçu

Il est facile de visualiser votre Help Center personnalisé et de voir en temps réel les modifications que vous avez apportées avant de les mettre en ligne, en utilisant le Aperçu pour la page d'accueil, les collections et les articles.

Vous pouvez également sélectionner différentes résolutions pour prévisualiser sur les appareils Mobile, Tablette et Bureau.

Help Center ne prend pas en charge l'intégration de formulaires, iFrames ou HTML personnalisé.

Avez-vous trouvé la réponse à votre question ?