We use cookies and similar technologies to improve your experience, analyse traffic, and personalise content. You can accept all cookies or reject non-essential ones.
Ce guide vous accompagne dans la création d’un portail et dans l’utilisation de chaque onglet de l’éditeur Design — Pages, Mises en page, Navigation, Composants et Image de marque — afin d’assembler une expérience complète et personnalisée, prête pour les participants.
Le portail s’ouvre dans l’éditeur Design — un assistant en trois étapes en haut de la page : Design → Aperçu → Publier.
Lorsque vous ouvrez un tout nouveau portail, cinq modèles de démarrage vous sont proposés. Chacun préremplit des pages, une structure de navigation, une mise en page avec barre latérale, une bannière principale et des composants pertinents, afin que vous disposiez immédiatement d’une base concrète :
| Modèle | Idéal pour | Pages préconstruites |
|---|---|---|
| Portail Revendeur | Libre-service pour RMA, garanties et factures | Accueil · Mes retours · Détail du retour · Garanties · Détail de la garantie · Factures · Mon compte |
| Portail Éducation | Tests, quiz, classements et certificats | Tableau de bord · Tests disponibles · Détail du test · Mes résultats · Détail du résultat · Classement · Certificats |
| Portail Support | Suivi des tickets et base de connaissances | Tableau de bord · Mes tickets · Détail du ticket · Base de connaissances · Article · Mon compte |
| Portail Recherche | Panels d’enquête et programmes de recherche | Tableau de bord · Mes enquêtes · Détail de l’enquête · Mes réponses · Scores · Certificats · Profil |
| Portail Survey Analytics | Tableaux de bord d’analyses personnels | Tableau de bord (avec widgets d’analyse) · Mes réponses · Scores · Profil |
| Toile vierge | Portails entièrement personnalisés, construits de zéro | Une seule page d’accueil — tout est à construire vous-même |
Choisissez le modèle le plus proche et personnalisez-le. Vous pouvez également changer de modèle plus tard depuis la barre d’outils sans perdre vos paramètres d’image de marque.
Le côté gauche de l’éditeur est une barre d’icônes comportant cinq onglets. Chaque onglet ouvre un panneau qui contrôle un aspect différent de votre portail. Cliquez sur l’icône pour changer de panneau ; le canevas à droite reflète immédiatement vos modifications.
L’onglet Pages est l’endroit où vous gérez chaque écran de votre portail. Chaque page comporte trois paramètres :
invoices devient panel.acme.com/invoices. Utilisez des lettres minuscules, des chiffres et des traits d’union. Un slug contenant un segment préfixé par deux-points — comme tickets/:ticketId — est une page dynamique : le même modèle affiche des enregistrements différents selon ce qui figure dans l’URL.Une page est désignée comme page d’accueil par défaut — celle vers laquelle les participants sont dirigés immédiatement après la connexion. Modifiez la page par défaut depuis les paramètres de la page.
Un slug de page tel que tickets/:ticketId crée une page dynamique. Lorsqu’un composant Liste de données navigue vers celle-ci, l’ID de l’enregistrement est placé dans l’URL et le composant Détail de données présent sur cette page charge automatiquement l’enregistrement correspondant. Ce schéma à deux composants et deux pages offre aux participants une expérience de navigation détaillée complète pour tout type d’enregistrement — sans code requis.
Pour ajouter une page : cliquez sur Ajouter une page, renseignez le titre, le slug et le niveau d’accès, puis cliquez sur Enregistrer. Pour supprimer une page, cliquez sur l’icône de suppression sur sa ligne — pensez ensuite à mettre à jour les éléments de navigation qui y renvoyaient.
Une mise en page est la coquille visuelle qui enveloppe chaque page — où se situe la navigation et comment la zone de contenu principale est proportionnée. Choisissez parmi les vignettes de mise en page disponibles :
Toutes les mises en page sont adaptatives (responsive) — la navigation s’adapte aux petits écrans sans travail supplémentaire.
L’onglet Navigation contrôle le menu que voient les participants dans la barre latérale (ou à l’endroit où la mise en page active place la navigation). Construisez et gérez la structure du menu :
Gardez une navigation ciblée — cinq à huit éléments est l’idéal. Les participants doivent pouvoir s’orienter en un coup d’œil. Les pages de détail dynamiques (par ex. tickets/:ticketId) n’ont pas besoin d’apparaître dans la navigation — les participants y accèdent en cliquant sur les lignes d’une liste.
L’onglet Composants est votre bibliothèque de blocs de construction. Sélectionnez d’abord une page dans l’onglet Pages pour l’ouvrir sur le canevas, puis basculez vers l’onglet Composants pour y ajouter des éléments.
Glissez-déposez n’importe quel composant sur le canevas, ou cliquez pour l’insérer en bas de la page. Chaque composant dispose d’un panneau de paramètres à droite de l’éditeur, où vous configurez son contenu, ses liaisons de données et son style.
Un nombre agrégé unique — compte, moyenne ou somme — issu de n’importe quelle entité de données, avec un filtre optionnel appliqué. Limité par défaut au participant connecté. Empilez-en plusieurs dans un Conteneur de section pour construire une barre de métriques :
Un tableau d’enregistrements paginé, triable et consultable par recherche. Dans les paramètres du composant, choisissez :
tickets/:ticketId), permettant une navigation détaillée complèteUne vue de détail complète pour un enregistrement unique, identifié par un paramètre d’URL. Placez ce composant sur une page dynamique (par ex. tickets/:ticketId), définissez le type d’entité, et définissez le nom du paramètre sur :ticketId. Lorsqu’un participant clique sur une ligne d’une Liste de données qui redirige ici, ce composant charge et affiche automatiquement l’enregistrement correspondant.
L’onglet Image de marque contrôle chaque élément de l’identité visuelle de votre portail — de ce que voient les participants avant même de se connecter, jusqu’au logo dans la barre latérale sur chaque page. Les modifications ici sont enregistrées automatiquement à la perte du focus.
Le logo de votre organisation, affiché dans l’en-tête de la barre latérale et bien en évidence sur les écrans de connexion et d’inscription. Pour définir ou changer le logo :
Si aucun logo spécifique au portail n’est défini, le portail utilise automatiquement le logo de votre organisation. Ainsi, un portail nouvellement créé a déjà une apparence conforme à votre marque, sans étape supplémentaire.
Le titre en gras que lisent les participants sur l’écran de connexion avant de s’authentifier — le premier texte de marque qu’ils voient sur votre domaine. Exemples :
Ce champ est traduisible : ajoutez une valeur pour chaque langue prise en charge par votre portail, et les participants la verront dans leur propre langue.
Un court paragraphe situé immédiatement sous le titre de connexion — un emplacement naturel pour le contexte du programme, les instructions de participation ou une brève proposition de valeur. Exemples :
Également traduisible par langue.
Le nom d’hôte personnalisé sur lequel ce portail est diffusé. Seuls les domaines de panel vérifiés (depuis Paramètres → Domaines → Panel participant) apparaissent dans la liste déroulante. Sélectionner un domaine ici est ce qui connecte votre design à l’URL réelle que les participants utiliseront.
Si vous n’avez pas encore ajouté de domaine, la liste déroulante affiche une option + Ajouter un nouveau domaine qui vous mène directement à l’écran de configuration du domaine. Revenez ensuite sélectionner le domaine une fois qu’il est vérifié.
Un identifiant court, compatible URL, utilisé dans le lien d’aperçu en direct afin que vous puissiez tester le portail depuis un véritable onglet de navigateur. Utilisez des lettres minuscules, des chiffres et des traits d’union. Il est défini automatiquement lors de la création du portail, mais peut être modifié ici si vous avez besoin d’un identifiant plus lisible.
Chaque modification, dans chaque onglet, est enregistrée automatiquement en arrière-plan. La barre d’outils affiche un indicateur de synchronisation — « Enregistré » lorsque tout est stocké, « Enregistrement… » brièvement pendant une mise à jour. Aucun bouton d’enregistrement manuel n’est nécessaire.
Tous les états enregistrés sont conservés dans le tiroir Historique des versions (icône d’horloge dans la barre d’outils). Retrouvez une version antérieure et cliquez sur Restaurer pour revenir en arrière — utile lorsqu’une modification expérimentale n’a pas donné le résultat escompté.
Chaque champ de texte de l’éditeur — titres de page, libellés de navigation, titres, paragraphes, libellés de bouton, titre de connexion et description de connexion — affiche un sélecteur de langue lorsque votre organisation a plusieurs langues activées. Renseignez chaque locale. Le portail s’affiche dans la langue préférée du participant et se replie sur la langue par défaut pour toute chaîne non traduite.
Une fois votre design assemblé, parcourez vous-même l’expérience complète avant qu’aucun participant ne puisse la voir. Poursuivez avec Aperçu et test de votre portail.