8 Créer votre propre thème

Vue d'ensemble

Par défaut, Zabbix fournit un certain nombre de thèmes d'interface prédéfinis. Pour créer un thème personnalisé, suivez la procédure étape par étape fournie ici.

Étape 1 : Créez votre thème

Pour créer votre propre thème :

  1. Créez un fichier CSS à partir de zéro ou copiez un thème existant (par exemple, blue-theme.css, dark-theme.css ou un autre) depuis le répertoire assets/styles/ et modifiez-le.
  2. Enregistrez votre thème (par exemple, custom-theme.css) dans le répertoire assets/styles/.
Étape 2: Activer votre thème dans la liste des thèmes

Pour rendre votre thème personnalisé disponible dans l'interface, vous devez l'ajouter à la liste des thèmes renvoyée par la méthode APP::getThemes(). Pour cela, il faut remplacer la méthode ZBase::getThemes() dans la classe APP comme suit:

  1. Ouvrez le fichier include/classes/core/APP.php et localisez la classe APP:
class APP extends ZBase {

}
  1. Dans la classe, avant son accolade fermante finale }, ajoutez la méthode suivante:
public static function getThemes() {
          return array_merge(parent::getThemes(), [
              'custom-theme' => _('Custom theme')
          ]);
}

où:

  • custom-theme - l'identifiant interne de votre thème et doit correspondre au nom de votre fichier CSS sans l'extension .css;
  • Custom theme - le nom affiché que vous verrez dans l'interface.

Pour ajouter plusieurs thèmes, listez-les dans le tableau en séparant chaque entrée par une virgule. Une virgule finale après la dernière entrée est facultative.

Par exemple:

      public static function getThemes() {
          return array_merge(parent::getThemes(), [
              'custom-theme' => _('Custom theme'),
              'anothertheme' => _('Another theme'),
              'onemoretheme' => _('One more theme')
          ]);
      }
Modification des couleurs du graphique

Pour modifier les couleurs du graphique, un enregistrement pour le nouveau thème doit être ajouté à la table de base de données graph_theme.

Exemple d'ajout d'un enregistrement à une base de données MySQL/MariaDB:

    mysql -u zabbix -p
    # Enter password:
mysql> USE zabbix;
mysql> INSERT INTO graph_theme (
    graphthemeid,
    theme,
    backgroundcolor,
    graphcolor,
    gridcolor,
    maingridcolor,
    gridbordercolor,
    textcolor,
    highlightcolor,
    leftpercentilecolor,
    rightpercentilecolor,
    nonworktimecolor,
    colorpalette
)
VALUES (
    5,
    'custom-theme',
    'FFFFFF',
    'FFFFFF',
    'CCD5D9',
    'ACBBC2',
    'ACBBC2',
    '1F2C33',
    'CC745E',
    '5ECCAB',
    'CC745E',
    'EBEBEB',
    '329F7E,C2583D,346D91,B26E44,CC6C91,7A6DC2,C4AA56,7C2731,BF75B8,73A350,B04833,633A60,879CCC,7FAD6C,324978,3F5C3D,795C94,D66B58,732230,809C5D,C79DD1'
);
Étape 3: Utiliser le nouveau thème

Dans l'interface Zabbix, vous pouvez soit définir ce thème comme thème par défaut, soit le sélectionner dans un profil utilisateur.