Comment augmenter la qualité des photos de produits JPG (Magento 2)


18

La compression JPG sur Magento 2 est très forte, de sorte que la qualité des images de produits devient vraiment mauvaise dans la vue Catalogue et Produit. Comment puis-je changer la compression d'image pour les JPG dans Magento 2?

Réponses:


15

Cette solution fonctionne pour moi:

Fichier: {Vendor} / {Module} /etc/di.xml

<?xml version="1.0"?>
<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
        xsi:noNamespaceSchemaLocation="urn:magento:framework:ObjectManager/etc/config.xsd">
    <preference for="Magento\Catalog\Model\Product\Image" type="{Vendor}\{Module}\Model\Product\Image" />
</config>

Fichier: {Vendeur} / {Module} / Modèle / Produit Vous pouvez définir la qualité à votre guise. Vider ensuite le cache d'images.

namespace {Vendor}\{Module}\Model\Product;

class Image extends \Magento\Catalog\Model\Product\Image {

    protected function _construct() {
        $this->_quality = 100;

        parent::_construct();
    }
}

quel est le chemin pour mettre ce fichier dans votre thème personnalisé? je ne peux pas comprendre la structure de classement M2s. M1 était tellement plus facile
styzzz

In app / code / {Vendor} / {Module}
Papamike

mais cela ne sera-t-il pas remplacé lors de la mise à niveau? J'ai pensé que tu devrais le mettre dans ton thème. non?
styzzz du

1
Non, le dossier {Vendor} doit être remplacé par votre espace de noms (pourrait être styzzz par exemple). Il ne sera pas annulé. Ex .: / app / code / styzzz / ImageCompression / ...
Papamike

Si vous avez une image PNG pour le produit, le niveau de compression est codé en dur dans l'adaptateur GD2: vendor/magento/framework/Image/Adapter/Gd2.php:167à 9 (max)
Franck Garnier

5

Comme pour Magento 2.3.2, il est possible de définir la qualité d'image sans changer le code:

Magasins> Configuration> Avancé> Système> Configuration de téléchargement d'images> Qualité> 100

Le chemin de configuration XML est:

system/upload_configuration/jpeg_quality

Cela ne fournit pas de réponse à la question. Une fois que vous avez une réputation suffisante, vous pourrez commenter n'importe quel message ; fournissez plutôt des réponses qui ne nécessitent pas de clarification de la part du demandeur . - De l'avis
Jai

1
"Comment puis-je changer la compression d'image pour les JPG dans Magento 2" ... N'était-ce pas la question?
K Vij

mieux que les autres réponses car aucun changement de code n'est requis
Barry

2

à l'intérieur - fournisseur / magento / module-catalogue / Helper / Image.php

Vous trouverez le générique:

public function setQuality($quality)
{
    $this->_getModel()->setQuality($quality);
    return $this;  
}

Si vous applaudissez à son utilisation, vous trouverez une méthode du même nom dans:

magento / module-catalogue / Modèle / Produit / Image.php

et à l'intérieur de ce fichier:

/**
 * Default quality value (for JPEG images only).
 *
 * @var int
 */         
protected $_quality = 80;

C'est cette valeur - qui doit être réglée sur 95.

Cela réduira la compression et les artefacts du site.

Vos gars supposeront que je dois apporter ces modifications avec un remplacement de code convenablement déployé - c'est-à-dire pas en modifiant ce fichier principal. Je ne suis pas un développeur magento sinon j'aurais une fissure ....


3
En fait, changer toutes les valeurs du Core (fournisseur) sera écrasé avec la prochaine mise à jour, donc changer les fichiers de base est en général une mauvaise idée
Marcel Hauri

2

Les réponses ici sont assez fausses OMI. Ce n'est pas la qualité que vous devriez être en train de changer de première main , c'est la taille des images. Pourquoi?

Eh bien, le fait est que lors de la compression d'une image pour obtenir la plus petite taille de fichier possible, le taux de compression est le plus avantageux pour atteindre cet objectif. Le second est les dimensions de l'image. De plus, vous devez toujours compresser l'image source d'origine avant de la réduire (je n'ai pas vérifié comment magento gère cela) pour réduire autant que possible la taille du fichier tout en préservant les détails.

Sur les écrans de rétine, vous avez besoin de 2x la taille affichée. Donc, pour obtenir une image nette affichée à 250x250 pixels, l'image doit être de 500x500 pixels.

Je commencerais donc par changer les thèmes view.xmlpour doubler la taille affichée. Si l'image ne semble toujours pas bonne, j'envisagerais d'augmenter le paramètre de qualité. Si vous avez le temps, vous pouvez également implémenter des images réactives (les tailles doublées ne sont donc chargées que sur les écrans à rétine ).

Vous pouvez également réduire la taille en supprimant toutes les métadonnées de l'image, vous ne savez pas si magento le fait par défaut ou non. Cela fait généralement partie de bons services de compression d'image.


1
Merci d'avoir expliqué ce compagnon! Je savais qu'il devait y avoir une raison logique à la tromperie d'image de magento! Je suis toujours un peu confus quant à la mise en œuvre. Donc, disons que mes produits s'affichent sur la page du produit sous forme de carré de 700 pixels, alors je devrais créer une image de 1400 pixels, puis changer le paramètre correspondant dans le fichier view.xml en 1400 pixels également? J'ai joué avec cela, ainsi que le remplacement mentionné dans d'autres réponses, mais la qualité est toujours plus faible sur la page du produit que lorsque je clique sur l'image pour entrer dans la vue `` zoomée ''.
Joshua Flood

@JoshuaFlood Je pense que l'image agrandie a sa propre entrée dans view.xml avec une taille plus grande, je ne me souviens pas exactement de quelle clé elle a ou de quelle taille
OZZIE

Pas de soucis, je l'ai trié. Merci pour le conseil! Je ne sais pas exactement ce qui l'a fait, mais j'avais oublié de remplacer les «petites» images par des images doubles, de sorte que le problème pouvait être là.
Joshua Flood

Ce n'est pas une bonne réponse. Ce que vous devez faire, c'est utiliser des images réactives et l'attribut srcset - pas seulement fournir une image plus grande en général qui sera réduite à chaque fois que nécessaire.
fritzmg

@fritzmg "de première main" "Si vous avez le temps, vous pouvez également implémenter des images réactives" .. quelle partie trouvez-vous difficile à comprendre?
OZZIE
En utilisant notre site, vous reconnaissez avoir lu et compris notre politique liée aux cookies et notre politique de confidentialité.
Licensed under cc by-sa 3.0 with attribution required.