8 Erstellen Ihres eigenen Themes

Übersicht

Standardmäßig stellt Zabbix eine Reihe vordefinierter Frontend-Themes bereit. Um ein benutzerdefiniertes Theme zu erstellen, folgen Sie der hier beschriebenen Schritt-für-Schritt-Anleitung.

Schritt 1: Erstellen Sie Ihr Theme

Um Ihr eigenes Theme zu erstellen:

  1. Erstellen Sie eine CSS-Datei von Grund auf neu oder kopieren Sie ein vorhandenes Theme (z. B. blue-theme.css, dark-theme.css oder ein anderes) aus dem Verzeichnis assets/styles/ und passen Sie es an.
  2. Speichern Sie Ihr Theme (zum Beispiel custom-theme.css) im Verzeichnis assets/styles/.
Schritt 2: Aktivieren Sie Ihr Theme in der Theme-Liste

Damit Ihr benutzerdefiniertes Theme im Frontend verfügbar ist, müssen Sie es der Liste der Themes hinzufügen, die von der Methode APP::getThemes() zurückgegeben wird. Dies geschieht, indem Sie die Methode ZBase::getThemes() innerhalb der Klasse APP wie folgt überschreiben:

  1. Öffnen Sie die Datei include/classes/core/APP.php und suchen Sie die Klasse APP:
class APP extends ZBase {

}
  1. Fügen Sie innerhalb der Klasse, vor der abschließenden geschweiften Klammer }, die folgende Methode hinzu:
public static function getThemes() {
          return array_merge(parent::getThemes(), [
              'custom-theme' => _('Custom theme')
          ]);
}

wobei:

  • custom-theme - die interne Kennung Ihres Themes und muss dem Namen Ihrer CSS-Datei ohne die Erweiterung .css entsprechen;
  • Custom theme - der Anzeigename, den Sie im Frontend sehen.

Um mehrere Themes hinzuzufügen, listen Sie sie im Array auf und trennen Sie jeden Eintrag durch ein Komma. Ein abschließendes Komma nach dem letzten Eintrag ist optional.

Zum Beispiel:

      public static function getThemes() {
          return array_merge(parent::getThemes(), [
              'custom-theme' => _('Custom theme'),
              'anothertheme' => _('Another theme'),
              'onemoretheme' => _('One more theme')
          ]);
      }
Ändern der Diagrammfarben

Um die Diagrammfarben zu ändern, muss ein Eintrag für das neue Theme in der Datenbanktabelle graph_theme hinzugefügt werden.

Beispiel zum Hinzufügen eines Eintrags zu einer MySQL/MariaDB-Datenbank:

    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'
);
Schritt 3: Das neue Theme verwenden

Im Zabbix-Frontend können Sie dieses Theme entweder als Standard-Theme festlegen oder es in einem Benutzerprofil auswählen.