Définition des styles de portail

  • Rversion finale: Zurich
  • Mis à jour 31 juil. 2025
  • 1 minute de lecture
  • Les pages sont constitué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 personnalisation comme définitions globales pour le portail. Si vous ne définissez pas CSS dans le thème ou la marque, les paramètres par défaut de Bootstrap sont utilisés.

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

    Paramètres Bootstrap par défaut

    Si aucun autre CSS n’est défini, tous les éléments utilisent les valeurs par défaut de la version 3.3.6 de Bootstrap. Vous pouvez utiliser les classes d’aide CSS d’amorce 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 marques. Les changements apportés aux couleurs du thème dans l’éditeur de marques s’affichent dans le champ de variables CSS de la table du portail [sp_portal]. La personnalisation des couleurs du thème remplace les valeurs par défaut de Bootstrap.

    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 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 du portail/Éditeur de marques.

    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 dans 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 de l’instance de widget

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

    Le CSS de l’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 Service Portal
    Diagramme illustrant les remplacements CSS de Portail de services