Wanneer het filter |compacte
wordt toegepast op een stylesheet of op JavaScript [1], zal het een compacte kopie maken waar commentaren, lege declaraties en overbodige spaties uit zijn verwijderd. In stylesheets worden relatieve URL’s door absolute vervangen:
#div {
background : url(../prive/images/fond-gris-anim.gif); /** image modifiable **/
width : 48px;
height : 48px;
margin : auto;
}
wordt
#div{background:url(http://www.domein.com/prive/images/fond-gris-anim.gif);width:48px;height:48px;margin:auto;}
.
Voor JavaScript wordt JavaScriptPacker) gebruikt.
Na dit nieuwe bestand in de map local/
te hebben opgeslagen, zal [<link rel="stylesheet" href="(#CHEMIN{spip_style.css}|compacte)" type="text/css" media="all" />]
iets dergelijks retourneren: <link rel="stylesheet" href="local/cache-css/spip_style-compacte-092e.css" type="text/css" media="all" />
Let op
Net als bij de automatische compressie worden de CSS-bestanden samengevoegd tot één stylesheet per media
.
Voorbeeld:
[<link rel="stylesheet" href="(#CHEMIN{spip_style.css}|compacte)" type="text/css" media="all" />]
[<link rel="stylesheet" href="(#CHEMIN{habillage.css}|compacte)" type="text/css" media="all" />]
[<link rel="stylesheet" href="(#CHEMIN{responsive.css}|compacte)" type="text/css" media="handheld" />]
[<link rel="stylesheet" href="(#CHEMIN{print.css}|compacte)" type="text/css" media="print" />]
De bestanden spip_styles.css
en habillage.css
worden in één gecompimeerd bestand gegroepeerd. Maar responsive.css
en print.css
krijgen elk een eigen gecomprimeerd bestand, respectievelijk met het attribuut media="handheld"
en media="print"
.
De compressie van js en css tegenhouden
Met het filter forceer je de compressie van een bestand, maar er bestaat ook een schrijfwijze om een specifiek bestand niet te comprimeren.
Voor CSS bestanden maak gje gebruik van één van de volgende attributen in de tag <link>
:
- id;
- name;
- type.
Voor JavaScript is het uitsluitend "id".