Définition des styles de portail

  • Rversion finale: Xanadu
  • Mis à jour 1 août 2024
  • 1 minute de lecture
  • Les pages sont composées de conteneurs, de colonnes, de lignes, de widgets et d’instances de widget. Vous pouvez configurer le CSS de chaque composant ou utiliser le CSS défini dans le thème et la marque comme définitions globales pour le portail. Si vous ne définissez pas le CSS dans le thème ou la marque, les valeurs par défaut de Bootstrap sont utilisées.

    Vous pouvez définir CSS dans votre portail à plusieurs niveaux.

    Paramètres d’amorce par défaut

    Si aucun autre CSS n’est défini, tous les éléments utilisent les valeurs par défaut de la version Bootstrap 3.3.6. Vous pouvez utiliser les classes d’assistance CSS Bootstrap avec n’importe quel Portail de services champ qui accepte CSS comme valeur. Pour afficher ou masquer Portail de services les conteneurs, utilisez les classes d’aide Bootstrap CSS Responsive Utilities telles que visible-lg ou hidden-md.

    Couleurs du thème de l’éditeur de marque/CSS du portail

    CSS défini dans l’onglet Couleurs de thème de l’éditeur de marque. Les modifications apportées aux couleurs du thème dans l’éditeur de marques apparaissent dans le champ de variables CSS de la table du portail [sp_portal]. La personnalisation des couleurs de thème remplace les paramètres Bootstrap par défaut.

    Interface utilisateur de l’éditeur de marque, affichant l’onglet Configuration rapide et l’aperçu du thème.

    CSS du thème

    CSS défini dans le champ de variables CSS de la table Thèmes [sp_theme]. Utilisez le CSS du thème autant que possible pour permettre une évolution plus flexible de votre portail à l’avenir.

    L’utilisation d’un thème remplace les couleurs du thème CSS/de l’éditeur de marques du portail.

    Page CSS

    CSS défini dans le champ CSS spécifique à la page de la table Pages [sp_page].

    Le CSS spécifique à la page remplace le CSS du thème.

    Classes CSS

    Vous pouvez définir des éléments de classes CSS sur la page à l’intérieur de chaque enregistrement respectif.

    Widget CSS

    CSS défini dans le champ CSS de la table Widgets [sp_widget].

    Le CSS du widget remplace le CSS du conteneur, de la colonne et de la ligne.

    CSS d’instance de widget

    CSS défini dans le champ CSS de la table d’instance [sp_instance].

    Le CSS d’instance de widget remplace toutes les autres définitions CSS.

    Remarque :
    Dans certains cas, les styles par défaut pour l’accessibilité peuvent remplacer le CSS défini pour un portail.
    Figure 1. Hiérarchie de l’application de style dans Portail de services
    Diagramme illustrant les remplacements CSS de Service Portal