Fonctionnalité de thème VergeOS
Comment créer et gérer des thèmes d’interface utilisateur personnalisés dans VergeOS, y compris la personnalisation des couleurs pour les graphiques, la navigation, les en-têtes, les éléments de chargement, les logos personnalisés, les favicons et la hiérarchie des thèmes.
VergeOS fournit un système de thème complet qui permet aux administrateurs de personnaliser l’apparence visuelle de l’interface utilisateur. La fonctionnalité de thème offre un contrôle granulaire sur les couleurs à travers différents composants de l’interface, notamment les graphiques, les éléments de navigation, les en-têtes, les chargeurs et les éléments généraux de l’interface.
Vue d'ensemble
Le système de thèmes de VergeOS permet aux organisations de créer des thèmes visuels personnalisés qui modifient les couleurs de l’interface et les éléments de marque. Cette fonctionnalité va au-delà du simple branding de l’interface utilisateur en offrant un contrôle détaillé sur des groupes spécifiques de composants UI, permettant une personnalisation visuelle complète qui peut s’aligner sur l’identité visuelle de l’entreprise ou améliorer l’expérience utilisateur.
Ce que vous apprendrez
Ce guide explique la fonctionnalité de thèmes de VergeOS, notamment où accéder aux fonctions de thème, quelles options de personnalisation sont disponibles et comment les différents composants du thème fonctionnent ensemble pour créer une apparence d’interface cohérente.
Vous comprendrez :
Où trouver la gestion des thèmes dans VergeOS
Quels groupes de propriétés de thème sont disponibles à la personnalisation
Comment fonctionnent la création et la gestion des thèmes
Quels formats de fichiers et quels éléments sont pris en charge
Comment les thèmes s’intègrent au système de branding UI existant
Exigences
Configuration de l’environnement :
Accès administrateur (permissions d’admin de cluster ou d’admin de locataire)
Connaissances préalables :
Navigation de base dans VergeOS et accès aux paramètres système
Estimation du temps
Temps d’exploration : 10 à 15 minutes pour comprendre toutes les options et fonctionnalités de thème
Accéder à la gestion des thèmes
Chemin de navigation
Le système de thèmes se trouve dans les paramètres système de VergeOS, accessibles via l’interface d’administration.
Accéder aux paramètres système: Accédez à Système > Paramètres pour accéder à la zone de configuration du système
Emplacement de la gestion des thèmes:
Dans le menu de navigation de gauche des Paramètres système, vous trouverez Thèmes comme section dédiée
La zone Thèmes affiche les thèmes existants sous forme de tableau avec les colonnes Nom, Description et Date de modification
Interface de gestion des thèmes
La page Paramètres système affiche les thèmes existants dans la Thèmes section, en affichant :
Nom: L’identifiant du thème (par exemple « light »)
Description: La description du thème (par exemple « paquet de thème clair pour Verge.io »)
Modifié: Date et heure de dernière modification
Création et gestion des thèmes
Création de nouveaux thèmes
Accès au nouveau thème: Cliquez sur Nouveau thème dans le menu de navigation de gauche pour accéder à l’interface de création de thème.
Composants de l’interface de création de thème:
Configuration de base du thème
Champ Nom: Champ obligatoire pour l’identification du thème
Champ Description: Texte descriptif facultatif pour la documentation du thème
Interrupteur d’activation: Active ou désactive le thème
Liste déroulante Basé sur: Choisissez entre « thème système clair » ou « thème système sombre » comme base
Groupes de propriétés de couleur
La section Couleurs organise les éléments personnalisables de l’interface en groupes logiques :
Graphiques:
Six propriétés de couleur de graphique individuelles (Graphique 1-6)
Chaque propriété contrôle les couleurs des différentes séries de données dans les graphiques et les visualisations
Comprend un sélecteur de couleur, une saisie de valeur hexadécimale, un curseur d’opacité et une fonction de réinitialisation individuelle
Chargeur:
Propriété du chargeur: Contrôle l’apparence de l’indicateur de chargement principal
Suiveur du chargeur: Configure les couleurs des éléments animés de chargement
Aperçu en temps réel des animations de chargement
Navigation de gauche:
Arrière-plan: Couleur d’arrière-plan du panneau de navigation
Texte: Couleur standard du texte de navigation
Survol: Couleur d’arrière-plan pour les états de survol
Texte au survol: Couleur du texte lors des interactions de survol
Texte désactivé: Couleur des éléments de navigation inactifs
En-tête:
Arrière-plan: Arrière-plan de la barre d’en-tête principale
Bouton actif: Mise en évidence du bouton actif
Texte du bouton: Couleur standard du texte des boutons
Texte au survol du bouton: Couleur du texte lors du survol du bouton
Arrière-plan de la barre de navigation: Couleur de la zone de navigation du sous-en-tête
Général:
Arrière-plan: Arrière-plan global de l’application
Arrière-plan de la carte: Arrière-plan des composants de type carte
Bordure de la carte: Couleurs des bordures des panneaux et des cartes
Texte: Couleur du texte principal dans toute l’interface
Gestion des ressources
Options de logo personnalisé:
Logo personnalisé (grand): Images de 144x36 pixels pour l’affichage du logo standard
Logo personnalisé (petit): Images de 44x44 pixels pour les zones compactes
Formats pris en charge : JPG, PNG, SVG
Favicon personnalisé:
Prise en charge du format de fichier ICO pour la personnalisation de l’onglet du navigateur
Liens vers la section Fichiers pour la gestion du téléversement des ressources
Outils de personnalisation des couleurs
Contrôles individuels des propriétés:
Sélecteur de couleur: Interface visuelle de sélection des couleurs
Saisie de valeur hexadécimale: Saisie directe du code couleur hexadécimal
Curseur d’opacité: Contrôle de la transparence pour chaque propriété de couleur
Bouton de réinitialisation: Réinitialisation individuelle d’une propriété aux valeurs par défaut
Réinitialisation globale: Lien « Réinitialiser » pour restaurer toutes les propriétés d’un groupe
Fonctionnalité d’aperçu
Aperçu en temps réel:
Section d’aperçu: Affiche une représentation en direct des changements de thème
Aperçus sensibles au contexte: Visualisations différentes selon le groupe de propriétés sélectionné
Éléments interactifs: L’aperçu inclut les états de survol et les composants interactifs
Explication des groupes de propriétés du thème
Groupe de propriétés des graphiques
Contrôle la palette de couleurs des graphiques, diagrammes et visualisations de données dans tout VergeOS. Chaque propriété Graphique (1-6) représente les couleurs de différentes séries de données, permettant une image de marque cohérente pour la visualisation des données sur les tableaux de bord et les interfaces de rapports.
Groupe de propriétés du chargeur
Gère l’apparence des indicateurs de chargement et des éléments de progression. La propriété Chargeur contrôle la couleur principale du spinner ou de la barre de progression, tandis que Suiveur du chargeur gère les éléments animés dans les interfaces de chargement.
Groupe de propriétés de la navigation de gauche
Personnalise le panneau de navigation principal qui apparaît sur le côté gauche de l’interface VergeOS. Les propriétés contrôlent les couleurs d’arrière-plan, les couleurs du texte et les états interactifs afin de garantir que la navigation reste fonctionnelle et visuellement cohérente.
Groupe de propriétés de l’en-tête
Gère la barre d’en-tête supérieure et ses composants, notamment les boutons, les éléments de navigation et les couleurs d’arrière-plan. Ces paramètres affectent l’en-tête principal de l’interface qui contient la navigation système et les commandes utilisateur.
Groupe de propriétés générales
Contrôle les éléments fondamentaux de l’interface, notamment les arrière-plans globaux, les composants de type carte, les bordures et les couleurs du texte principal. Ces propriétés établissent l’apparence visuelle de base sur laquelle les autres composants s’appuient.
Intégration avec l’image de marque existante
Intégration des ressources
Les logos et favicons personnalisés téléversés via le système de thèmes s’intègrent aux jeux de couleurs pour offrir une personnalisation visuelle complète. Les ressources conservent leur qualité et leur positionnement tout en s’adaptant à la palette de couleurs choisie.
Application et gestion des thèmes
Activation du thème
Les thèmes sont appliqués immédiatement lors de l’enregistrement avec le bouton Soumettre. L’interrupteur Activé permet de créer et de stocker des thèmes sans activation immédiate.
Hiérarchie des thèmes
Dans les environnements multitenants, les thèmes s’appliquent au niveau du locataire actuel et sont hérités vers les niveaux inférieurs, sauf substitution. Cela permet une image de marque cohérente à travers les hiérarchies organisationnelles tout en autorisant la personnalisation lorsque nécessaire.
Persistance du thème
Les paramètres de thème sont stockés dans la configuration système de VergeOS et persistent à travers les mises à jour et les redémarrages du système. Les configurations de thème peuvent être exportées et importées dans le cadre des processus de sauvegarde et de restauration du système.
Formats de fichiers et spécifications pris en charge
Exigences relatives au logo
Grand logo: 144x36 pixels, formats JPG/PNG/SVG
Petit logo: 44x44 pixels, formats JPG/PNG/SVG
Recommandations sur la taille des fichiers : moins de 1 Mo pour des performances optimales
Spécifications du favicon
Format: Format de fichier ICO requis
Tailles recommandées: 16x16, 32x32, 48x48 pixels dans un seul fichier ICO
Prise en charge de secours du format PNG dans les navigateurs modernes
Prise en charge des formats de couleur
Valeurs hexadécimales: Codes de couleur hexadécimaux standard à 6 chiffres (#RRGGBB)
Opacité: Transparence basée sur un pourcentage (0-100 %)
Sélecteur de couleur: Interface visuelle de sélection RGB/HSV
Fonctionnalité de réinitialisation: Retour immédiat aux valeurs par défaut du système
La fonctionnalité de thèmes de VergeOS offre des capacités complètes de personnalisation visuelle qui permettent aux organisations de créer des interfaces cohérentes et personnalisées tout en maintenant des normes d’utilisabilité et d’accessibilité sur l’ensemble de leur plateforme de virtualisation.
Mis à jour
Ce contenu vous a-t-il été utile ?