Alterando temas de interface no ONLYOFFICE Docs

Introdução

Além dos temas nativos (Claro, Clássico e Escuro), o ONLYOFFICE Docs permite a personalização completa da interface através de temas de cores próprios. Siga as etapas deste guia para implementar o seu design personalizado.

1. Crie o seu arquivo de configuração no formato .json. A estrutura deve seguir este padrão:

   {
       "name": "Amazing theme",
       "l10n": {
           "fr": "Thème incroyable",
           "de": "Geweldig thema",
           "pt": "Tema incrível"
       },
       "id": "theme-amazing",
       "type": "light",
       "colors": {
           "toolbar-header-document": "#446995",
           "toolbar-header-spreadsheet": "#40865c",
           "toolbar-header-presentation": "#aa5252",
           "border-color-shading": "rgba(0, 0, 0, 0.15)"
       }
   }

   Os parâmetros obrigatórios são:

   • name: Define o nome do tema que será exibido no seletor de temas nas Configurações Avançadas.
   • l10n: Objeto de localização. As chaves devem ser os códigos de idioma de duas letras (ex: pt, fr, de) e os valores a tradução do nome do tema.
   • id: Identificador único do tema. Deve iniciar com o prefixo theme- e conter apenas letras (a-Z), números (1-9), hifens (-) ou underscores (_).
   • type: Define a base do tema: dark ou light.
   • colors: Objeto que contém as variáveis de cores. Você pode utilizar valores hexadecimais (HEX) ou RGBA. Consulte a seção abaixo para o catálogo completo das variáveis.

2. Após criar o arquivo, armazene-o no diretório de recursos de temas correspondente ao seu ambiente:

   • Windows: %ProgramFiles%\ONLYOFFICE\DocumentServer\web-apps\apps\common\main\resources\themes
   • Linux: /var/www/onlyoffice/documentserver/web-apps/apps/common/main/resources/themes
   • Docker: Copie o arquivo para o contêiner utilizando o comando: sudo docker cp ./seu_arquivo.json {container_id}:/var/www/onlyoffice/documentserver/web-apps/apps/common/main/resources/themes

3. O servidor possui um cache interno com tempo de vida de 5 minutos. Após esse período, atualize a página do seu editor para que o novo tema fique disponível.

   Se a alteração não for refletida, será necessário reiniciar os serviços e limpar o cache. Consulte o nosso guia de Solução de Problemas para Linux ou Docker.
4. O tema aparecerá automaticamente na lista Tema da interface, dentro das Configurações Avançadas dos editores.