Jump to content

1.7.3 Perte de qualité images produits page catégorie


Recommended Posts

Bonjour à tous,

 

Version 1.7.3

J'ai un soucis avec la qualité de mes images produits sur les pages catégorie. 

Mes photos produits uploadées de base sont carrées(700 x 700 px)

Dans Apparences/images :

J'ai réduit les dimensions de l'image à 270 x 270 px pour l'affichage sur la page catégorie.

Et plus bas dans les réglages, la compression Jpeg est à 100/100 donc je ne devrais pas avoir de perte de qualité.

Voir screen shots de mes réglages en PJ

 

Or, les images produits affichées sur la page catégorie perdent en qualité(visible à vue d'oeil). Ce qui est étrange, c'est que quand je fais clic droit "Ouvrir l'image dans un nouvel onglet", cette image source(même dimensions) est nickel, sans perte de qualité.

 

J'espère avoir été clair dans mes explications.

Merci d'avance

 

 

reglages-images-1.jpg

reglages-images-2.jpg

Link to comment
Share on other sites

Ce sont les mêmes dimensions 270 x 270 px en visualisation et celle quand je fais clic droit "Ouvrir l'image dans un nouvel onglet". Sauf que celle de l'onglet(image source) est de qualité normale... Je ne comprends pas.

Link to comment
Share on other sites

Peut-être une piste... J'ai les deux logos "ajouter au panier" et "aperçu rapide" qui s'affichent au dessus de l'image au passage de la souris. Pensez-vous que le fait d'avoir ces deux boutons préprogrammés pour superposer l'image puissent "flouter" l'image au préalable ? Je dis ça, je ne dis rien. En plus, ça fait un moment que je veux les dégager. Si quelqu'un sait comment faire dans le code pour écarter cette piste.

Link to comment
Share on other sites

J'ai réussi à supprimer les logos mais le problème ne provient pas de là.

Je pense qu'il doit provenir de cette partie de code mais je ne suis pas développeur.

 

            {block name='product_thumbnail'}
              <a href="{$product.url}" class="thumbnail product-thumbnail">
                <img
                      class="ttproduct-img1"
                      src = "{$product.cover.bySize.home_default.url}"
                      alt = "{if !empty($product.cover.legend)}{$product.cover.legend}{else}{$product.name|truncate:30:'...'}{/if}"
                      data-full-size-image-url = "{$product.cover.large.url}"
                    >
                    {hook h="displayTtproductImageHover" id_product=$product.id_product home='home_default' large='large_default'}    
              </a>
            {/block}

Link to comment
Share on other sites

Tu crois vraiment que nous avons que ça à faire que de jouer aux devinettes.

Si tu ne veux pas donner toutes les informations pertinentes pourquoi devrions nous, nous passer notre temps à chercher?

Déjà dans un premier temps vérifie que ton navigateur n'est pas zoomé (Ctrl+0)

Ensuite tu nous dis ce que signifie clic-droit et enfin puisque tu te refuse a nous donner ton url, tu nous dit pourquoi tes images sont en 270x270 alors que sur la démo (qui est nickel chez moi) c'est 270x371

Link to comment
Share on other sites

Mon site est en dev c'est pour cette raison que je ne peux pas communiquer d'url.

Je ne t'ai pas demandé de "passer ton temps à chercher", c'était juste pour savoir si quelqu'un avait rencontré ce problème ou connaissait la solution. Si non, ce n'est pas grave.

Mon navigateur n'est pas zoomé. 

Je n'ai pas réécris "clic droit [Ouvrir l'image dans un nouvel onglet] pour afficher l'image source" puisque je l'avais déjà précisé au dessus dans mes explications.

J'ai redimensionné au format 270 x 270 les pixels pour un format carré comme mes photos uploadées. Je te confirme que le problème est également présent sur la démo et c'est visible sur ma dernière pièce jointe. 

Je supprimerai ce topic d'ici la fin du week-end puisqu'il ne sert à rien.

Merci à ceux qui ont tenté de m'aider.

Link to comment
Share on other sites

  • 2 years later...
  • 2 weeks later...

Bonjour,

J'ai finalement trouvé pourquoi les images perdaient de leur qualité. Elles s'affichaient en réalité en 269.98 x 269.98 et non en 270 x 270 en raison de mon thème (leotheme). 

J'ai donc modifié les padding left et right de 15px à 14px comme ceci, et le tour est joué :

@media (min-width: 1200px) {
.col-xs, .col-xs-2-4, .col-xs-4-8, .col-xs-7-2, .col-xs-9-6, .col-xs-1, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9, .col-xs-10, .col-xs-11, .col-xs-12, .col-sm, .col-sm-2-4, .col-sm-4-8, .col-sm-7-2, .col-sm-9-6, .col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12, .col-md, .col-md-2-4, .col-md-4-8, .col-md-7-2, .col-md-9-6, .col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12, .col-lg, .col-lg-2-4, .col-lg-4-8, .col-lg-7-2, .col-lg-9-6, .col-lg-1, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12, .col-xl, .col-xl-2-4, .col-xl-4-8, .col-xl-7-2, .col-xl-9-6, .col-xl-1, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-10, .col-xl-11, .col-xl-12 {
    padding-right: 14px;
    padding-left: 14px;
} }

Je ne sais pas si la solution est optimale mais ça fonctionne.

 

 

Edited by AureAure (see edit history)
Link to comment
Share on other sites

  • 1 month later...

Bonjour,

Je rencontre depuis quelques temps un problème similaire : les images sur les pages catégories sont de mauvaise qualité (floues).

A priori elles s'affichent en 299,98 x 299,98 alors qu'elles devraient être en 300 x 300. Le site est en version 1.7.6.1.

Voici l'url d'une page illustrant le problème : https://www.thalassor.fr/baignoire-balneo-25

Je ne trouve pas comment corriger ce problème. Si vous avez une piste, je suis preneur !

Merci par avance à tous.

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
×
×
  • Create New...