Gestion de l'apparence
⚙️ Accès dans le backoffice :
Edition « Portail usager » > Apparence (lien présent dans la colonne de droite)
Cette interface permet de gérer des paramètres graphiques permettant de modifier et ainsi personnaliser l'apparence de votre thème.
Attention : l'interface de gestion de l'apparence est disponible uniquement si un thème graphique personnalisable est déployé sur votre instance. Aujourd'hui, il n'existe qu'un seul thème personnalisable : Donna.
🔑 Fonctionnalités clés
- Configuration du style d'une série d'éléments composant le thème : couleurs, typographie, position, bordures et tailles de certains éléments...(voir la liste complète ci-dessous Link: https://doc-publik.entrouvert.com/admin-fonctionnel/modifier-le-contenu-des-portails/gestion-de-lapparence/#liste-des-parametres-disponibles-dans-le-theme-donna )
- Modifications immédiatement visibles permettant d'ajuster les paramètres en direct.
- Modifications observables en mobile et en destop.
- Concernant le choix des couleurs, un indicateur permet de vérifier le respect des niveaux de contraste pour contribuer à améliorer l'accessibilité du portail.
Liste des paramètres disponibles dans le thème Donna
Paramètres principaux
- Couleur principale : elle s'applique automatiquement à certains types d'élément du thème (boutons, entrées du menu...). Via les autres paramètres, l'application automatique de la couleur principale peut être modifiée pour sélectionner une autre couleur.
- Police ; les typographies disponibles sont : "Asap", "Fira Sans", "Inter", "Krub", "Lato", "Luciole", "Poppins", "Montserrat", "Source Sans Pro"
En-tête
- Couleur d'arrière-plan de l'en-tête de page
- Taille de l'image (logo du site) sur desktop
- Taille de l'image (logo du site) sur mobile
Menu principal
- Alignement du menu : à gauche, centré, à droite
- Couleur d'arrière-plan du menu
- Couleur du texte du menu
- Couleur d'arrière-plan de l'élément actif du menu
- Couleur de l'élément actif du menu
- Couleur de soulignement de l'élément actif
Pages
- Couleur d'arrière-plan
- Taille du corps de texte en desktop
- Taille du corps de texte en mobile
- Hauteur de l'image de la page en desktop (si elle existe)
- Hauteur de l'image de la page en mobile (si elle existe)
Titres
- Taille du titre de niveau 1 (titre de la page)
- Graisse du titre de niveau 1 (titre de la page)
- Couleur du titre de niveau 1
- Hauteur de la bordure du titre de niveau 1
- Graisse des titres de cellule
- Taille des titres de niveau 2
- Taille des titres de niveau 3
- Taille des titres de niveau 4
Bouton
- Couleur des boutons
- Arrondi des coins (border radius)
Liens
- Couleur des liens
- Couleur des liens dans les listes de liens
- Couleur des liens au survol dans les listes de liens
Cellule
- Casse typographique des titres de cellule : Par défaut(= Majuscule au début), capitales, minuscules
- Taille de l'image associée à une cellule
- Couleur de l'arrière plan des cellules
Notifications
- pk-information - couleur de la bordure
- pk-attention - couleur de la bordure
- pk-error - couleur de la bordure
- pk-success - couleur de la bordure
Formulaires
- Arrondi des coins des champs (border radius)
- A venir : Alignement du titre à gauche, centré
Pied de page
- Couleur d'arrière-plan du pied de page
- Couleur des liens du pied de page
🔗 Liens utiles pour gérer la mise en page
- Les cellules Link: https://doc-publik.entrouvert.com/admin-fonctionnel/modifier-le-contenu-des-portails/les-cellules/
- Classes CSS réutilisables Link: https://doc-publik.entrouvert.com/admin-fonctionnel/modifier-le-contenu-des-portails/classes-css/
🛠️ Pour aller plus loin sur l'accessibilité
Afin de rendre les contenus et services de votre portail usager compréhensibles et utilisables par les personnes en situation de handicap et pour vous conformer aux obligations légales qui incombent aux administrations publiques, des liens utiles :
- Accéder au référentiel général d'amélioration de l'accessibilité (RGAA) Link: https://accessibilite.numerique.gouv.fr/
- Charte d'accessibilité de la communication de l'État Link: https://www.info.gouv.fr/organisation/service-d-information-du-gouvernement-sig/charte-daccessibilite-de-la-communication-de-letat