kalyx.fr

Redimensionner l’image envoyée sur le serveur

you can read this post in english on wprecipes

Les appareils photo numériques actuels affichent des résolutions de plus de 6 millions de pixels, soit des images pesant plus de 2 Mo. Si le but de votre blog n’est pas de proposer le téléchargement de photos pour les faire tirer, il n’y a aucun intérêt à garder sur le serveur une image aussi lourde.

D’autre part, les extensions de type lightbox (à ce propos, je viens de découvrir ColorBox) affiche l’image d’origine. Si celle-ci est lourde, l’utilisateur risque de s’impatienter.

La meilleure solution est de redimensionner l’image avant de l’envoyer avec un utilitaire comme photoresize pour éviter un transfert de fichier trop long. Cependant ceci peut parfois être fastidieux, donc autant demander à WordPress de remplacer l’image envoyée par une image redimensionnée à une taille plus adaptée aux écrans.

Ce script va donc remplacer l’image uploadée par celle créée par WordPress en tant qu’image de grande taille (à vous de définir les dimensions dans Réglages -> Médias ).

Il vous suffit d’ajouter ce bout de code dans le fichier functions.php de votre thème. Les images que vous enverrez seront dorénavant redimensionner automatiquement.

<?php
add_filter('wp_generate_attachment_metadata','replace_uploaded_image');

function replace_uploaded_image($image_data) {

// si l'image est plus petite que la grande taille, on ne fait rien
if (!isset($image_data['sizes']['large'])) return $image_data;

// les chemins absolus de l'image d'origine et de la grande image générée par WordPress
$upload_dir = wp_upload_dir();
$uploaded_image_location = $upload_dir['basedir'] . '/' .$image_data['file'];
$large_image_location = $upload_dir['path'] . '/' .$image_data['sizes']['large']['file'];

// on supprime l'image d'origine
unlink($uploaded_image_location);

// on change le nom de la grande image qui prend le nom de l'image d'origine
rename($large_image_location,$uploaded_image_location);

// on met à jour les metadonnées associées à l'image
$image_data['width'] = $image_data['sizes']['large']['width'];
$image_data['height'] = $image_data['sizes']['large']['height'];
unset($image_data['sizes']['large']);

return $image_data;
}
?>

Pour l’exemple, cliquez sur les photos ci-dessous et comparez le temps d’attente :

Avant l’ajout du script (image originale : 2816 x 1584 – 1,54 Mo)

L'Aubrac sous la neige

Après l’ajout du script (la même image redimensionnée à 1024 × 576 – 98 ko)

L'Aubrac sous la neige - toujours

Ce qui nous donne sur  le serveur :

On a gagné 1,54 Mo d’espace disque la seconde fois!

Posted in: Astuces

This entry was posted on Vendredi, février 5th, 2010 at 10:41 and is filed under Astuces. You can follow any responses to this entry through the RSS 2.0 feed. You can leave a response, or trackback from your own site.