8 Creando su propio tema

Descripción general

De forma predeterminada, Zabbix proporciona una serie de temas predefinidos del frontend. Para crear un tema personalizado, siga el procedimiento paso a paso que se proporciona aquí.

Paso 1: Cree su tema

Para crear su propio tema:

  1. Cree un archivo CSS desde cero o copie un tema existente (como blue-theme.css, dark-theme.css u otro) del directorio assets/styles/ y modifíquelo.
  2. Guarde su tema (por ejemplo, custom-theme.css) en el directorio assets/styles/.
Paso 2: Habilite su tema en la lista de temas

Para que su tema personalizado esté disponible en el frontend, debe agregarlo a la lista de temas devuelta por el método APP::getThemes(). Esto se hace sobrescribiendo el método ZBase::getThemes() dentro de la clase APP de la siguiente manera:

  1. Abra el archivo include/classes/core/APP.php y localice la clase APP:
class APP extends ZBase {

}
  1. Dentro de la clase, antes de su llave de cierre final }, agregue el siguiente método:
public static function getThemes() {
          return array_merge(parent::getThemes(), [
              'custom-theme' => _('Custom theme')
          ]);
}

donde:

  • custom-theme - es el identificador interno de su tema y debe coincidir con el nombre de su archivo CSS sin la extensión .css;
  • Custom theme - es el nombre visible que verá en el frontend.

Para agregar varios temas, enumérelos en el array, separando cada entrada con una coma. Una coma final después de la última entrada es opcional.

Por ejemplo:

      public static function getThemes() {
          return array_merge(parent::getThemes(), [
              'custom-theme' => _('Custom theme'),
              'anothertheme' => _('Another theme'),
              'onemoretheme' => _('One more theme')
          ]);
      }
Cambio de colores del gráfico

Para cambiar los colores del gráfico, debe agregarse un registro para el nuevo tema en la tabla de base de datos graph_theme.

Ejemplo de agregar un registro a una base de datos 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'
);
Paso 3: Use el nuevo tema

En el frontend de Zabbix, puede establecer este tema como el tema predeterminado o seleccionarlo en un perfil de usuario.