A customização no Liferay

Uma das maiores vantagens do Liferay está na sua alta capacidade de customização. Na Weblibre, todos os projetos ficam do modo como o cliente deseja, totalmente adaptado para a sua necessidade.

A customização do Liferay pode ser feita de várias maneiras, uma delas é a adptação dos CSS ( Cascading Style Sheets ou folha de estilos ), que pode ser entendido, de forma bem simples, como um padrão para toda a aparencia do portal, seja suas cores, suas fontes ou até mesmo as suas imagens.

Com a utilização apropriada dos CSS garantimos que as páginas contenham o mesmo estilo, mantendo assim a identidade visual da empresa, proporcionando uma maior satisfação do nosso cliente, pois seu portal Liferay pode ser facilmente adaptado as cores de sua empresa, de suas intranet’s ou até a de outros portais que estejam associados a empresa contratante.

Outra enorme vantagem da utilização de CSS é sua rápida modificação, pois normalmente basta apenas a modifcação em uma folha de estilos e podemos alterar totalmente as configurações estéticas do portal Liferay.

Onde encontrar os CSS do Liferay

Os CSS’s do portal Liferay podem ser encontrados no diretório /{diretorio_tomcat}/webapps/ROOT/html/{tema_atual}/css.

Nessa pasta estão todos os arquivos CSS que o Liferay utiliza, e a modificação desses arquivos já altera a forma como o site é exibido.

Exemplo do Código CSS do arquivo custom.css

/* ---------- Banner ---------- */

#banner {
background: transparent url(../images/common/banner_bg.jpg) no-repeat center 20px;
height: 80px;
top: -1px;
}

#banner h1.logo {
display: block;
float: left;
font-size: 2em;
left: 5%;
margin: 6px 20px 0px 0px;
margin-top: 12px;
padding-top: 20px;
padding: 0;
position: absolute;
}

Como descobrir qual atributo alterar?

Uma das maneiras de descobrir a função de uma caracteristica do css que se deseja modificar é a utilização de ferramentas. Essas ferramentas podem ser variadas e algumas são gratuitas.

Abaixo alguns dos programas que utilizamos aqui na WebLibre para customizar nosso Liferay:

• Web Developer plugin: esse plugin para Mozilla Firefox é gratuito e permite a visualização de varios recursos que o navegador utiliza para exibir a página. Entre eles estão os recursos de CSS. O plugin pode ser baixado diretamente da página do desenvolvedor: