Utiliser les thumbnails avec WordPress

Publié le 6 août 2017

Les images sur un site web sont extrêmement importantes mais elles sont une des principales sources de ralentissement, la plupart des pages web contiennent des images mal redimensionnées ou mal optimisées.

 

C’est pourquoi je vous propose dans cet article d’utiliser les thumbnails avec WordPress.

 

Qu’est ce qu’une thumbnail ?
Pour ceux qui l’ignorent une thumnail est un dérivé d’une image que l’on va pouvoir redimensionner en fonction de nos utilisations.
Par exemple avec l’image ci-dessous:

 


On peut voir l’image originale à gauche et ensuite 2 thumbnails de cette image, de plus on peut choisir de centrer l’image en la rognant (image du milieu) ou non (image à droite).

 

Comment l’intégrer dans WordPress ?
Pas besoin de plugin, il suffit simplement de créer un nouveau thumbnail dans le fichier function.php.

add_theme_support('post-thumbnails');
add_image_size('large', 700, '', true);
add_image_size('custom-size', 700, 200, true);

La première ligne autorise la création de thumbnail dans le thème.
Les deux autres lignes sont la création de deux thumnails.
La première est une image carrée de 700×700 qui porte le nom de ‘large’, la deuxieme est une image de 700×200 qui porte le nom de ‘custom-size’. A noter également, le ‘true’ qui permet d’activer le rognage des images, si celui-ci est à ‘false’ alors les images perdront leurs proportions d’origine.

 

Pour finir il ne reste qu’à appeler la thumnail en PHP dans un template, par exemple pour récupérer l’image mise en avant d’un article en 700×700 on utilisera :

get_post_thumbnail_id($post->ID), 'large'

Voilà j’espère que j’ai été assez clair, en conclusion on pourrait dire que les thumbnails sont un bon moyen de gérer les images sur un site web avec la possibilité pour chaque image d’avoir plusieurs tailles.