CSS Cacheer Pré Processeur PHP pour les CSS

, par Matthieu Marcillaud

| 1

Au fil des lectures CSS du Web, depuis la page comment avoir une compatibilité entre navigateur systématiquement, en me baladant sur le site d’Anthony Short, on découvre le plugin grid pour css cacheer, du coup, on s’intérroge... Mais c’est quoi CSS Cacheer ?

CSS Cacheer est un préprocesseur php pour les feuilles de styles CSS et a été développé par Shaun Inman.

Ce petit bout de php permet des écritures assez fabuleuses, qui permettent d’éclaircir et de simplifier les codes css.

Fonctionnalités

Définir et utiliser des constantes :

@constants{
	claire:#f90;
	foncee:#630;
	police: Tahoma Verdana Georgia; 
}

#navigation{
	color:const(claire);
	font-family:const(police);
}
#conteneur{
	background:const(foncee);
}

Ecriture par imbrications successives :

ul {
	margin:10px;
	li{
		display:inline; float:left;
		a{
			text-decoration:none;
			:hover{text-decoration:underline;}
		}
	}
}

/* devient */
ul{margin:10px;}
ul li{display:inline; float:left;}
ul li a{text-decoration:none;}
ul li a:hover{text-decoration:underline;}

Blocs de paramètres

base(navigation_onglet){
	ul{margin:10px;}
	ul li{display:inline; float:left;}
	ul li a{text-decoration:none;}
	ul li a:hover{text-decoration:underline;}
}

.navigation_generale{
	based-on:base(navigation_onglet);
	border:1px solid gray;
}

Mise en plugin SPIP

J’en ai fait un plugin pour SPIP 2.0 (qui utilise la balise #FILTRE).

Le plugin est téléchargeable ici : Css Cacheer pour SPIP

Le fonctionnement est expliqué dans le plugin. Il suffit d’avoir un css compilé par SPIP (donc dans un theme.css.html par exemple), appellé par #URL_PAGE{theme.css} dans la balise <link> de l’entete html, et d’ajouter dans ce fichier la balise #FILTRE{css_preprocess}, ce qui peut donner :

#CACHE{3600*24*7*2,cache-client}
#HTTP_HEADER{Content-Type: text/css; charset=utf-8}
#HTTP_HEADER{Vary: Accept-Encoding}
#FILTRE{css_preprocess}

...code css...