As vezes cada um quer ter sua própria cara.

Tratando CSS no Plone por seção, template ou id

Uma coisa que vira e mexe acaba aparecendo para todo webdesigners é a necessidade de tratar de maneira especial alguma seção ou mesmo alguma página específica do seu site. Seja por motivos de organização ou por questões puramente estéticas, não é difícil um cliente pedir para que uma seção tenha um cabeçalho próprio ou algum detalhe especial no layout para ser diferenciado do resto da página.

Como fazer isso sem precisar duplicar templates inteiros é uma questão que pode ser resolvida com facilidade no Plone. Por meio da linguagem ZPT o Plone já trás sempre em sua tag body algumas classes específicas.

O código, que se encontra no main_template é o seguinte:

<body tal:attributes="class string:${here/getSectionFromURL} template-${template/id};">


E quando visualizado por exemplo em uma notícia, fica assim:

<body class="section-news template-newsitem_view">


Ou seja, ele varia conforme o local do portal e o template usado. A primeira classe, .section-news, é aplicada dentro de todo diretório news. Esse comportamento se repete em todo portal. A segunda classe, .template-newsitem_view aparece em todos os templates de notícia.

Com o uso inteligente do css podemos agora tratar de maneira especial cada uma dessas situações. No exemplo abaixo, colocamos um cabeçalho próprio para toda a seção de notícias do site:

.section-news #portal-header {background: url(cabecalho-noticias.png) no-repeat;}


Apenas isso já dá um poder imenso para o designer mudar suas páginas e as diversas áreas do site. Mas existe ainda uma maneira de ser ainda mais pontual nessa customização. basta adicionar a linha destacada em negrito a tag body do main_template:

<body tal:attributes="id string:${here/id};

                      class string:${here/getSectionFromURL} template-${template/id};">



Após ser renderizado em uma página esta tag vai ganhar um id igual ao id do Plone e poderia aparecer assim:

<body id="quem-somos" class="section-institucional template-template-document_view">


É claro que não é sadio nem muito inteligente tratar todas as páginas de maneira independente,  mas mesmo assim esse recurso pode ser bastante útil para situações muito específicas ou casos de emergência.