Noter: Ce guide vous montrera comment éditer les fichiers Core WordPress, je ne le recommande pas vraiment. Ne l’utilisez que si vous savez ce que vous faites. Le guide a été écrit il y a longtemps lorsque vous ne pouviez pas définir des emplacements de recadrage personnalisés, vous pouvez maintenant définir votre emplacement de recadrage lors de l’utilisation de la fonction add_image_size afin que ce guide ne soit plus applicable.
J’ai beaucoup utilisé la nouvelle fonction de vignettes de publication WordPress ces derniers temps dans le développement de thèmes. Je me suis détourné de la méthode plus lente, moins efficace et moins conviviale d’utilisation du script TimThumb pour redimensionner les images sur les sites alimentés par WordPress.
Et même si c’est une excellente fonction à intégrer à WordPress, elle a ses « défauts », comme le fait qu’il n’y a aucun paramètre pour définir l’emplacement/la position de recadrage de l’image lorsqu’elle est redimensionnée.
Emplacement de recadrage
Lorsque je travaillais sur mon site l’autre jour, j’ai remarqué que lorsque les vignettes du thème WordPress étaient recadrées, toute la moitié supérieure était coupée, ce qui ne donnait pas vraiment aux gens une bonne idée de ce à quoi le thème ressemblerait réellement.
Vous trouverez ci-dessous une image amusante que j’ai trouvée vous montrant une autre raison pour laquelle vous voudrez peut-être choisir différents emplacements de recadrage pour vos images au lieu de toujours utiliser le recadrage « central » par défaut.
Modifier le recadrage central par défaut pour les vignettes
Malheureusement, pour changer l’emplacement de recadrage des vignettes, vous devrez vous salir un peu les mains avec les fichiers Core WordPress. Suivez simplement les étapes ci-dessous pour modifier l’emplacement de recadrage de vos vignettes (cela ne le changera pas pour TOUTES les vignettes définies dans vos functions.php et les paramètres multimédias).
- Étape 1: Accédez à votre dossier wp-includes
- Étape 2: Recherchez et ouvrez le fichier media.php
- Étape 3: Localisez le code suivant (autour de la ligne 3.61 dans WordPress 3.1.1)
$s_x = floor( ($orig_w - $crop_w) / 2 );
$s_y = floor( ($orig_h - $crop_h) / 2 );
- Étape 4: Modifier Le code selon vos besoins (voir explication ci-dessous)
Modification des valeurs de recadrage
Ces deux lignes que vous avez trouvées sont chargées de recadrer vos vignettes. La valeur par défaut consiste à prendre la largeur et la hauteur d’origine et à les recadrer de manière égale vers le centre. Cependant, vous pouvez facilement le changer pour recadrer en haut, à gauche, en haut à gauche… etc.
Recadrer à partir du haut
Pour recadrer à partir du haut, vous devez simplement rendre la valeur y égale à 0, alors modifiez la deuxième ligne de code pour qu’elle ressemble à ceci :
$s_y = 0; // floor( ($orig_h - $crop_h) / 2 );
Recadrer du centre gauche
Pour recadrer à partir de la gauche, vous devez rendre la valeur x égale à 0, alors modifiez la première ligne de code pour qu’elle ressemble à ceci :
$s_x = 0; // floor( ($orig_w - $crop_w) / 2 );
Recadrer en haut à gauche
Combinez les deux derniers échantillons pour recadrer une image en haut à gauche.
$s_y = 0; // floor( ($orig_h - $crop_h) / 2 );
$s_x = 0; // floor( ($orig_w - $crop_w) / 2 );
Regénérer les vignettes WordPress
N’oubliez pas que si vous modifiez l’emplacement de recadrage de vos vignettes, vous devrez toutes les recadrer. Vous pouvez le faire facilement avec l’un des deux plugins suivants : Reconstruction de vignettes AJAX ou Régénérer les vignettes.