web-dev-qa-db-fra.com

Pourquoi WordPress automatique recadrer toutes mes images?

Suis nouveau dans WordPress, lorsque je télécharge une image, WordPress recadre automatiquement dans ses propres formats, ce que je n’ai pas mentionné dans la section Médias (Paramètres "Médias).

Les paramètres que j'ai enregistrés dans le support sont:
Setting which i saved in media.

Et quand je vérifie dans le répertoire, il se découpe automatiquement dans ces tailles:
enter image description here

Comment ça se passe?

image-resizecropping
6
abhishek360

WordPress par défaut est conçu pour générer 3 types de recadrage de toutes les images téléchargées (Media):

  • Vignette (généralement 150px × 150px)
  • Moyen (généralement 300px × 300px)
  • Large (généralement 1024px × 1024px)

C'est pour assurer la vitesse du site avec différentes tailles si nécessaire. Donc, avec le téléchargement de l'image originale, il y aurait au moins 4 fichiers-

  1. Le fichier d'origine (non recadré),
  2. Grand,
  3. Moyen, et
  4. La vignette.

Comme vous le savez déjà, à partir de /wp-admin/options-media.php, vous pouvez également modifier les dimensions de la taille par défaut. Ainsi, vous pouvez toujours utiliser les tailles par défaut pour vos besoins personnels. Mais si vous avez encore besoin d'une nouvelle taille, WordPress vous permet également d'ajouter de nouvelles tailles d'image.

L'utilisation de add_image_size() function avec le paramètre souhaité vous permet d'ajouter une nouvelle taille pour votre site. Utilisez la fonction dans votre functions.php pour ajouter la taille d'image souhaitée:

add_image_size( $name, $width, $height, $crop );

Où -
$name: string écrivez le nom entre guillemets simples, c'est-à-dire 'portfolio'
$width: entier écrivez la largeur souhaitée, c'est-à-dire 500 (en px)
$height: integet écrivez la hauteur souhaitée, c'est-à-dire 300 (en px)
$crop: boolean write true si vous souhaitez rogner l’image, sinon utilisez false

Généralement, nous pouvons appeler différentes images sélectionnées dans n’importe quel endroit de notre thème en utilisant:

the_post_thumbnail( 'medium' ); //it will display only the medium size of the original image

Si vous souhaitez utiliser votre nouvelle taille, utilisez:

the_post_thumbnail( 'portfolio' ); //as I named my size as 'portfolio'

AVERTISSEMENT: Comme par défaut, WordPress génère 3 tailles d'image personnalisables, il crée 4 fichiers pour chaque image. L'utilisation de plusieurs nouvelles tailles augmentera le nombre de fichiers dans l'hôte de votre site. Ainsi, utiliser plus de tailles d'image sera un problème pour le problème d'espace hôte de votre site - cela consommera plus d'espaces de site.

MODIFIER

Et après avoir ajouté chaque nouvelle taille d'image, le plugin le plus important est:

" Régénérer la vignette - WordPress Plugin

En réalité, la taille d'image nouvellement attribuée ne peut être disponible que dans les images récemment téléchargées. Donc, pour obtenir la nouvelle taille de toutes les images précédemment téléchargées, vous aurez besoin de l'installation du plugin et de régénérer à nouveau toutes les vignettes. Ce serait une mesure unique qui durerait pour toujours *.

Et votre réponse principale devrait être:
Vitesse du site: WordPress recadre les images pour augmenter la vitesse du site. Si vous utilisez Google PageSpeed, vous saurez qu'il suggère:

Servez des images à l'échelle
Si vous redimensionnez correctement les images, vous pourrez économiser de nombreux octets de données.
Apprendre encore plus

EDIT 2

Comme vous l'avez déjà suggéré, si votre plugin utilise une fonction add_image_size() similaire, il peut créer une nouvelle taille d'image. Donc, après avoir désactivé vos plugins, si vous utilisez le plugin Regenerate Thumbnails pour régénérer les vignettes, vous obtiendrez les tailles réelles. Si cela ne vous aide pas, consultez le functions.php de votre thème ou tout fichier de fonctions ajoutées pour une telle fonction add_image_size() et vous savez maintenant quoi faire.

9
Mayeenul Islam

Oui, WordPress redimensionne et recadre toutes les images en fonction de ce que votre thème défini comme @Gerard a déjà expliqué dans sa réponse. Donc, le dernier argument booléen pour add_image_size() est de rogner ou non. Notez que cela ne définit pas la position du recadrage. Pour modifier ce comportement regardez cette réponse par exemple .

Qu'est-ce qui se passe dans le noyau?

Comme vous l'avez déjà vu dans la source de add_image_size(), WP utilise le global $_wp_additiona_image_sizes pour stocker et gérer les paramètres de votre génération d'images. Désormais, lorsque vous téléchargez une image, la classe WP_Image_Editor entre en jeu et - en fonction des extensions PHP activées sur votre serveur - appelle WP_Image_Editor_Gd ou WP_Image_Editor_Imagick . Les deux singletons ont maintenant une méthode resize() qui appelle image_resize_dimensions() . À la fin, image_resize_dimensions() fait not redimensionne ou recadre l'image. Il ne fait que calculer les valeurs.

Ceci est fait par la méthode crop() dans la classe Imagick et en utilisant PHP natif imagecopyresampled() dans la classe Gd.

Comment désactiver le recadrage?

Premièrement, nous avons beaucoup de possibilités:

  • détecte la classe utilisée (PHP ext. est prise en charge), puis intercepte ce qui est utilisé pour le rognage (voir ci-dessus).
  • Court-circuitez tout le processus et laissez image_resize_dimensions() faire son travail.

Nous allons utiliser la méthode plus tard ici. N'hésitez pas à ajouter votre propre solution en tant que réponse séparée. Voici ce que le noyau nous offre: Un filtre contenant tous les paramètres.

$output = apply_filters( 'image_resize_dimensions', null, $orig_w, $orig_h, $dest_w, $dest_h, $crop );

Maintenant, le premier argument est null, qui indique à la ligne suivante si vous voulez écraser ce que cette fonction fait en interne - et le remplacer par notre propre comportement - ou non. Donc, si nous retournons quelque chose en dehors de null, c'est ce que core utilisera. Gardez à l'esprit que vous pouvez mettre n'importe quoi, mais Core attendra toujours la même valeur de retour que image_resize_dimensions() utilise par défaut. Parmi les commentaires en ligne:

Le tableau de retour correspond aux paramètres à imagecopyresampled():

int dst_x, int dst_y,

int src_x, int src_y,

int dst_w, int dst_h,

int src_w, int src_h

Désormais, pour désactiver simplement le recadrage, il faudrait remplacer (en d’autres termes: cloner) l’ensemble des éléments internes, ce que nous voulons éviter. Par conséquent, nous utilisons un "filtre ponctuel" qui se désactive. Nous faisons cela pour utiliser les composants internes, mais supprimons simplement ce dont nous n’avons pas besoin.

<?php
defined( 'ABSPATH' ) or exit;
/* Plugin Name: (#124009) Disable image crop */

add_filter( 'image_resize_dimensions', 'wpse124009DisableCrop', 10, 6 );
function wpse124009DisableCrop( $enable, $orig_w, $orig_h, $dest_w, $dest_h, $crop )
{
    // Instantly disable this filter after the first run
    remove_filter( current_filter(), __FUNCTION__ );

    return image_resize_dimensions( $orig_w, $orig_h, $dest_w, $dest_h, false );
}

Maintenant, le recadrage est désactivé partout _. Si vous utilisez plusieurs sites ou si vous ne voulez pas savoir si ce plugin est activé, utilisez-le simplement comme plug-in mu.

S'il vous plaît gardez à l'esprit que ci-dessus n'est pas testé, mais écrit de ma tête après avoir lu la source de base.

Information additionnelle

Plus d'informations sur les classes de traitement des images dans les diapositives de Marko de WordCamp Europe et la vidéo de la présentation sont disponibles sur WordPress.tv .

7
kaiser

Normalement, c'est parce qu'un thème Wordpress utilise les vignettes de son code: dans les boucles, les galeries, etc. Il est défini dans le fichier functions.php:

add_image_size( $name, $width, $height, $crop );

Par exemple, comme ceci:

add_theme_support('post-thumbnails');
add_image_size('custom-thumbnail', 80, 80, true );
add_image_size('medium-thumbnail', 180, 120, true );
add_image_size('large-thumbnail', 571, 300, true );

Je ne vous recommande pas de supprimer le code si vous voulez vraiment garder le bon fonctionnement de votre thème. Si vous souhaitez le supprimer, vous devez supprimer les appels des autres fichiers où il est utilisé. généralement dans le fichier loop.php.

3
Gerard

Les plugins et les thèmes peuvent définir leurs propres tailles de vignettes. WordPress convertira toutes les images récemment téléchargées en toutes les définitions de taille enregistrées.

2
Gerald Schneider