Znuny / OTRS ((Community Edition)) - Skins - Temas - Diseño

Znuny / OTRS ((Community Edition)) - Skins - Temas - Diseño

Es posible cambiar la apariencia del sistema de tickets Znuny, para ello se puede crear un nuevo skin.

Cambiar el ajuste de Skin - Tema en Znuny

Cada Agent puede elegir por sí mismo qué skin desea utilizar. Después de la instalación de Znuny, solo existe el skin estándar. El skin de Znuny define el diseño de la interfaz. En sus ajustes personales, encontrará la opción de reemplazar su skin actual por otro.

Crear un nuevo skin

Modificar CSS

Si tiene una instalación de Znuny en docker, los skins se encuentran en la siguiente carpeta: /var/lib/docker/volumes/znuny_opt_znuny /_data/var/ httpd/htdocs/skins/Agent de lo contrario en * *$Znuny_HOME/var/httpd/htdocs/skins/Agent/$SKIN_NAME**

Nueva carpeta

Si aún no se ha añadido ningún skin, solo encontrará la carpeta “default” en esta ruta. Para añadir un nuevo skin, primero debe añadir una nueva carpeta. Por ejemplo, “my_skin”.

Modificar el diseño

Para modificar el diseño, puede crear la carpeta “css” dentro de la carpeta “my_skin”. Los skins funcionan de tal manera que siempre se carga el skin CSS estándar. En su propio skin, puede sobrescribir los valores del skin estándar. Por ejemplo, sobrescribiendo clases CSS del skin por defecto:

CSS del skin estándar: Skin/default/Core.css

.Navigation {
  height: 100px;
}

Podría, por ejemplo, sobrescribirlo con: /* Skin/my_skin/Core.css

.Navigation {
  height: 30px;
}

Posteriormente, debe crear un archivo de configuración en la carpeta $Znuny-HOME/Kernel/Config/Files/XML/{skinName}.xml. Este debe tener la siguiente estructura:

<?xml version="1.0" encoding="utf-8" ?>
<znuny_config version="2.0" init="Changes">
    <ConfigItem Name="AgentLogo" Required="0" Valid="1">
        <Description Translatable="0">The logo shown in the header of the agent interface. The URL to the image must be
            a relative URL to the skin image directory.
        </Description>
        <Group>Framework</Group>
        <SubGroup>Frontend::Agent</SubGroup>
        <Setting>
            <Hash>
                <Item Key="URL">
                    https://softoft.de/Znuny_Wortmarke_Sub_Digital_Blau_156hoch-zugeschnitten-300x113.png
                </Item>
                <Item Key="StyleTop">13px</Item>
                <Item Key="StyleRight">75px</Item>
                <Item Key="StyleHeight">67px</Item>
                <Item Key="StyleWidth">244px</Item>
            </Hash>
        </Setting>
    </ConfigItem>

    <ConfigItem Name="Loader::Agent::Skin###001-softoftSkin" Required="0" Valid="1">
        <Description Translatable="0"></Description>
        <Group>Framework</Group>
        <SubGroup>Frontend::Agent</SubGroup>
        <Setting>
            <Hash>
                <Item Key="InternalName">softoftSkin</Item>
                <Item Key="VisibleName">softoftSkin</Item>
                <Item Key="Description"></Item>
                <Item Key="HomePage"></Item>
            </Hash>
        </Setting>
    </ConfigItem>
</znuny_config>