Les Custom Pages sont des pages libres conçues pour créer tout type de contenu (CGU, FAQ, Guide d'utilisation de la communauté) ne pouvant pas être intégré sur d'autres chaînes/sections de la plateforme.
Tu peux regarder la vidéo suivante pour découvrir toutes les étapes une par une.
Types de Custom Pages
Pour du contenu essentiellement textuel, sans mise en page élaborée.
Ces pages sont rapides à créer en autonomie depuis Word ou Google Docs.
- Conditions Générales d'Utilisation (CGU)
- Règlement de jeu concours
- Politique de confidentialité
- Charte communautaire
Pour du contenu structuré, illustré ou interactif.
Ces pages nécessitent des compétences HTML/CSS/JS et sont généralement créées par l'équipe Skeepers.
- FAQ illustrée ou mise en page avancée
- Page d'accueil explicative sur le fonctionnement de la communauté
- Pages avec iFrames (formulaires externes, ressources embarquées)
Une Custom Page ne doit pas être confondue avec un canal. Aucune interaction membre (like, commentaire, soumission de contenu) n'est possible sur ce type de page. Leur objectif principal est d'héberger et présenter des informations en les rendant accessibles à la communauté.
Créer une page
Deux options s'offrent à toi selon la complexité du contenu :
Option 1 : Faire appel à l'équipe Skeepers
Pour des pages complexes (FAQ illustrée, landing page mise en page, intégration HTML/CSS avancée), contacte l'équipe Brand Communities pour la création et les modifications.
La création ou modification de Custom Pages complexes nécessite des compétences HTML/CSS/JS. Si tu n'as pas ces compétences, l'équipe Skeepers peut le faire pour toi.
Option 2 : Créer toi-même ta Custom Page
Pour du contenu textuel ou une mise en page simple (CGU, règlement, politique de confidentialité, iframe), tu peux créer ta Custom Page facilement et en toute autonomie avec Word ou Google Docs.
Si tu souhaites intégrer une iframe dans ta Custom Page (par exemple pour afficher un questionnaire, un formulaire ou un outil externe), consulte l’article dédié.
Si tu choisis de créer ta Custom Page, voici quelques prérequis et tips :
Les polices courantes fonctionnent sans installation et sont généralement disponibles sur les logiciels de traitement de texte : Arial, Calibri, Helvetica, Open Sans, Roboto.
Si tu as besoin d'une police personnalisée, il faut l'installer :
- Télécharge la police au format .otf
- Double-clique sur le fichier
- Clique sur Installer
- Redémarre Word ou Google Docs pour retrouver ta police dans la liste
Ajuste la taille de la police et l'interligne pour que le texte soit homogène et agréable à lire une fois intégré dans la communauté.
Utilise le gras et l'italique pour hiérarchiser et structurer le contenu.
Applique une couleur uniforme à l'ensemble du texte. Utilise une couleur distincte pour les liens afin de les rendre facilement identifiables.
Sur Word, le fond de page doit être transparent, pas blanc.
Dans l'onglet Design > Couleur de page, sélectionne Aucune couleur.
Importer une page dans la communauté
Après avoir finalisé ta page dans Word ou Google Docs, tu peux consulter le tutoriel vidéo ou suivre ces étapes pour l'importer dans la communauté :
Étape 1 : Exporter en HTML
- Dans Word : Fichier > Enregistrer une copie > Page web (.html)
- Dans Google Docs : Fichier > Télécharger > Page web (.html)
Étape 2 : Accéder au code
Ouvre le fichier HTML qui vient d'être téléchargé :
- Clic droit sur le fichier > Ouvrir avec > Bloc-notes, ou
- Clic droit sur le fichier > Ouvrir avec > Navigateur.
Si tu décides d'ouvrir le fichier via un navigateur, suis ces étapes une fois la page ouverte :
- Clic droit > Inspecter
- Clic droit sur la première ligne de code (qui commence par <html lang...>) > Edit as HTML.
Étape 3 : Héberger les images (si la page en contient)
Si ta page contient des images (logo, illustrations,...), tu devras les héberger en ligne avant d'intégrer le code :
- Dans le back-office, va dans Configuration > Look & feel > Images
- Dépose tes fichiers images (formats JPG ou PNG) et clique sur une image pour copier son URL
- Dans le code HTML (sur bloc-notes ou navigateur), fais un clic droit sur l'image ou utilise CTRL + F pour trouver <img alt src=...>
- Remplace la valeur de l'attribut src par l'URL de l'image concernée
- Répète cette opération pour chaque image
Par exemple, si ton fichier image s'appelle "Community banner.jpg", cherche "banner.jpg" dans le code. Les espaces sont encodés différemment et le nom complet peut ne pas apparaître tel quel.
Étape 4 : Copier le code
- Appuie sur CTRL + A pour sélectionner tout le code
- Puis sur CTRL + C pour le copier
Étape 5 : Ajouter la Custom Page dans le back-office
Dans le back-office, va dans Configuration > Custom pages, et clique sur Add a custom page, puis :
- Donne un titre à ta page personnalisée
- Clique sur
Source dans l'éditeur de texte
- Colle ton code avec CTRL + V
Étape 6 : Corriger le style des liens (si la page en contient)
- Appuie sur CTRL + F et recherche "a:link".
- Ajoute ".WordSection1" devant "a:link".
- Répète la même opération devant "a:visited".
Cela empêche le style des liens de s'appliquer à l'ensemble de la plateforme.
Tu peux ensuite cliquer sur Save pour enregistrer ta Custom Page.
Étape 7 : Intégrer la Custom Page
Pour savoir où intégrer les Custom Pages dans la communauté, mais surtout comment, consulte cet article.