|
SPIP |
Article validé
L’article « |compacte » vient d’être publié par Ricardo Porto.
|compacte
terça-feira 23 de Setembro de 2025, por Ricardo Porto
O filtro |compacte (compacta) aplicado a um ficheiro CSS ou Javascript [1] cria uma cópia compactada, com tamanho mais pequeno, em que são removidos os comentários, as declarações vazias, os espaços supérfluos etc. [2] (nos ficheiros de script Javascript, o filtro usa a classe JavaScriptPacker).
Após ter guardado o novo ficheiro no diretório local/, o filtro retorna o link [<link rel="stylesheet" href="(#CHEMIN{spip_style.css}|compacte)" type="text/css" media="all" />] que resultará em algo como: <link rel="stylesheet" href="local/cache-css/spip_style-compacte-092e.css" type="text/css" media="all" />
Nota
Este filtro, como a compressão automática, agrupa os ficheiros CSS compactados por media.
Exemplo:
[<link rel="stylesheet" href="(#CHEMIN{spip_style.css}|compacte)" type="text/css" media="all">]
[<link rel="stylesheet" href="(#CHEMIN{layout.css}|compacte)" type="text/css" media="all">]
[<link rel="stylesheet" href="(#CHEMIN{responsivo.css}|compacte)" type="text/css" media="handheld">]
[<link rel="stylesheet" href="(#CHEMIN{impressao.css}|compacte)" type="text/css" media="print">]
As folhas de estilos spip_styles.css et layout.css serão agrupadas no mesmo ficheiro compactado. responsivo.css e impressao.css ficarão em ficheiros compactados distintos com, respetivamente, o atributo media="handheld" e media="print".
Desativar caso a caso a compressão dos ficheiros .js e .css
Este filtro força a compressão de um ficheiro. Existe uma sintaxe para desativar a compressão em ficheiros específicos.
Para os ficheiros CSS, precisa informar um dos atributos a seguir na sua tag <link>:
– id ;
– name ;
– type.
Para os ficheiros Javascript, precisa informar o atributo « id ».
[1] O ficheiro ao qual o filtro é aplicado deve ter «.js» ou «.css» como extensão.
[2] nos ficheiros CSS, o filtro transforma todos os URLs presentes em URLs absolutos:
#div {
background : url(../prive/images/fundo-cinzento-anim.gif); /** imagem alterável **/
width : 48px;
height : 48px;
margin : auto;
}
é convertido em
#div{background:url(http://www.domaine.tld/prive/images/fundo-cinzento-anim.gif);width:48px;height:48px;margin:auto;}
— Enviado por SPIP