Spip :: Filtre |image_optimiser
le
Dans ce Hack nous allons voir comment créer un filtre pour Spip afin d’optimiser nos images Jpeg et Png. Cette optimisation est nécessaire si vous souhaitez améliorer les performances d’affichage de votre site et si vous voulez obtenir un bon score avec "Page Speed" de Google.
Notre filtre va utiliser 2 utilitaires préconisés par Google, jpegoptim et optipng.
Pour les installer (Linux/Ubuntu) :
sudo apt-get install jpegoptim optipngDans le dossier squelettes de votre Spip ouvrez le fichier mes_fonctions.php ou créez-le s’il n’existe pas puis ajoutez le code suivant :
* Filtre d'optimisation des jpeg et png
*/
function image_optimiser($img)
{
if (strlen($img)==0) return false;
$source = trim(extraire_attribut($img, 'src'));
if (strlen($source) < 1)
{
$source = $img;
$img = "<img src='$source' />";
}
// les protocoles web prennent au moins 3 lettres
if (preg_match(';^(\w{3,7}://);', $source)){
include_spip('inc/distant');
$fichier = _DIR_RACINE . copie_locale($source);
if (!$fichier) return "";
}
else
{
// enlever le timestamp eventuel
$source=preg_replace(',[?][0-9]+$,','',$source);
$fichier = $source;
}
$terminaison_dest = "";
if (preg_match(",\.(gif|jpe?g|png)($|[?]),i", $fichier, $regs)) {
$terminaison = strtolower($regs[1]);
$terminaison_dest = $terminaison;
if ($terminaison == "gif") $terminaison_dest = "png";
}
// c'est ici que selon l'extention de l'image
// nous alons utiliser soit jpegoptim, soit optipng
// pour optimiser nos images
if ($terminaison == "jpg")
{
passthru("jpegoptim ".$fichier." > /dev/null");
}
if ($terminaison == "png")
{
passthru("optipng ".$fichier." > /dev/null");
}
return $img;
}
Toute la première partie très inspirée des filtres existants de Spip a pour fonction de récupérer le chemin vers le fichier image. Puis, nous appliquons l’optimisation avec l’utilitaire correspondant à chaque type de fichier.
Pour utiliser notre filtre dans un squelette :
Appliquer à une image d'un thème par exemple
][(#CHEMIN{vers/mon/image}|balise_img|image_optimiser)]
Appliquer à un Logo
][(#LOGO_ARTICLE|image_optimiser)]
Ce petit filtre est très basique et il peut bien sur être largement améliorer avec notamment la prise en compte d’arguments permettant de passer des paramètres aux utilitaires jpegoptim et optipng.
Répondre à cet article
Suivre les commentaires :
| 