Skip to content

Customizar

Pedro Guimarães edited this page Oct 5, 2015 · 3 revisions

Para realizar uma customização deste software , aplicando seu estilo e marcas à aplicação para uso próprio, basta realizar os seguintes passos.

Antes de começar, é necessário:

  • Fazer um fork do repositório explorador;
  • Configurar as fontes e garantir que os alvos de teste e compilação estejam funcionando de acordo com a página Configurando a fonte;
  • Ter (ou estar pronto para aprender) habilidades básicas em Freemarker, HTML e CSS.

Como funciona

A customização do explorador é feita em outro projeto: portal-web-theme. Esta abordagem separa os arquivos relacionados a tema do projeto principal, de uma maneira simples, permitindo que você mantenha a aparência e usabilidade do seu projeto com a aplicação da sua marca, sem a necessidade de alterações ao código do explorador.

O web-theme se transforma em uma dependência do explorador. Na hora da compilação, o Gradle usa um plugin (veja war overlay) para combinar o pacote de tema com a aplicação principal.

Como ambos os projetos utilizam a mesma estrutura de diretórios e arquivos, os arquivos do pacote de tema são copiados e empacotados dentro da aplicação principal, de acordo com o

diagrama

Mais detalhes

Gradle

O Gradle é responsável por aplicar a customização à aplicação web. Para indicar ao Gradle a sua customização, é necessário o seguinte:

  1. Criar um arquivo chamado 'theme.gradle' dentro do diretório 'config/gradle'. Veja o arquivo de exemplo 'config/gradle/default/theme.gradle.example' para compreender a sintaxe.

Layout

O layout define como juntar partes diferentes de uma página. Pode ser visto como o esqueleto genérico para todas as páginas geradas em que você especifica o CSS e os fragmentos header/footer. O layout do explorador está é definido em '/src/main/webapp/decorators/layouts/sibbr/layout.ftl'.

Para adicionar o seu próprio 'layout.ftl', é necessário o seguinte:

  1. Criar um diretório '/src/main/webapp/decorators/layouts/<sua_instituição>;
  2. Criar um arquivo '/src/main/webapp/decorators/layouts/<sua_instituição>/layout.ftl' e modificar seu arquivo 'theme.gradle' de acordo com ele.

Sitemesh

O Sitemesh é utilizado para aplicar o template a todas as páginas geradas dinamicamente.

Criando o seu tema!

Para criar o seu tema, é necessário o seguinte:

  1. Copiar e modificar o web-theme;
  2. Instalar o projeto de acordo com as orientações da Wiki