Na matéria precedente, vimos quais as vantagens das folhas de estilo CSS. Vejamos agora qual o uso específico que o SPIP faz das folhas de estilo.
Os styles definidos pelo SPIP
No SPIP, alguns estilos desempenham um papel importante: eles servem para alterar as propriedades gráficas dos elementos que não são definidos no seu HTML (aquele do seu template), mas no código gerado pelo SPIP. De facto, o SPIP associa automaticamente vários estilos ao código que gera.
Assim, quando usa os atalhos SPIP nas matérias (permitindo, por exemplo, colocar em negrito, itálico, criar links hipertexto, entretítulos, tabelas etc.), o SPIP gera as tags HTML necessárias para tal, com cada uma dessas tags dotada de um seletor CSS.
Por exemplo, o atalho seguinte:
Isto é um [link->http://www.uzine.net]é tranformado em código HTML:
Isto é um <a href="http://www.uzine.net" class="spip_out">link</a>
Qual é o interesse? Essas tags têm um nome específico no atributo class: esse nome define a qual «classe» pertencem, ou seja, um conjunto de elementos HTML que herdarão as mesmas propriedades gráficas definidas na folha de estilo.
No nosso exemplo, o código HTML é complementado pelo seletor CSS denominado «spip_out». O webmaster pode personalizar graficamente os links externos alterando a definição de estilo de «spip_out» (cor diferente, fundo colorido, fonte adotada etc.).
A aparência da maioria dos atalhos SPIP pode, desta forma, ser configurada nas folhas de estilo. Isto também se aplica aos formulários automáticos (responder a um fórum, assinar uma petição...) e outros ainda. Alguns desses estilos são muito úteis, até indispensáveis, enquanto outros são reservados aos webmasters que desejam obter efeitos mais exóticos.
Onde estão essas definições de estilo?
As propriedades gráficas aplicadas às páginas HTML são agrupadas nos ficheiros .css que acompanham os templates. Os templates e as suas folhas de estilo estão agrupados no diretório squelettes-dist/.
- As definições de estilo específicas do SPIP encontram-se na «folha de estilo externa» chamada spip_style.css. Esta reúne as definições de estilo associadas ao código gerado pelo SPIP (revisto nesta seção).
- Outra folha de estilo, spip_admin.css, permite controlar a aparência dos botões de administração («recalcular esta página» etc.).
Pode modificá-las (é até recomendado: «Dê-lhe os seus próprios estilos!»), mas note bem que não pode renomeá-las. Estes estilos são indispensáveis e devem ser definidos para garantir uma boa exibição dos seus templates.