Jump to content

Thème par défaut, bug agrandissement des miniatures produits


Recommended Posts

Bonjour,

j'utilise le thème par défaut de Prestashop 1.5.3.1 qui a été un peu modifié par un designer.

 

Je ne suis pas un expert en code HTML, CSS et encore moins PHP mais je voudrais tester voir si j'arrive à résoudre mon problème sans faire appel à un prestataire (mon problème me semble assez minime).

 

Actuellement, les images miniatures des produits sur la page d'accueil et sur les pages des catégories font 124px*124px. Je voudrais les mettre en 200*200px. Pour cela je vais dans l'admin > preference > images et je les change.

 

Le problème c'est que sur mon site, lorsque je les changes de tailles, ça n'affiche plus certains mots qui étaient en dessous des miniatures. Je suis sous firefox et en faite, si j'agrandi les miniatures, elle se superpose au texte et donc le cachent. Le texte c'est par exemple "A partir de --€" ou le titre du produit.

 

Savez-vous quel fichier je dois modifier et si possible quelle "variable" ou bout de code je vais devoir modifier ?

 

Je vous remercie pour votre aide

Link to comment
Share on other sites

Bonjour,

 

Si votre site est en ligne, donnez le lien ce sera plus facile de vous dire préciser quoi changer et ou.

Sinon il faut chercher dans les fichiers CSS, il doit y avoir des tailles définies qui ne sont plus bonnes une fois la taille des images changée. En inspectant le code avec firebug vous pourrez trouver quelle partie du code est en cause et dans quel fichier trouver ce code (et même la ligne dans le fichier! ;) )

Link to comment
Share on other sites

Hello,

merci pour ton aide.

 

Voici le bout de code concerné (trouvé avec firebug):

<li class="ajax_block_product first_item ">
<a class="product_image" title="titre" href="http://www.monsite.fr/ttttt/1394-URL.html">
<img width="124" height="124" alt="ALT" src="http://www.monsite.fr/3225-home_default/nom-de-limage.jpg">
</a>
<div style="width:125px; float:left; padding-left:25px; padding-top:10px">
<p class="s_title_block">
<a title="TITRE" href="http://www.monsite.fr/ttttt/1394-URLl">Nom du produit</a>
</p>
<p class="price_container">
<span class="price">A partir de 2,00 €</span>
</p>
</div>
<div style="float:left; width:45px; height:45px; margin-top:15px;">
</li>

J'ai cherché la chose suivante des les fichiers .css "ajax_block_product" mais je n'ai pas trouvé.

 

Voici deux screenshots, celui-ci c'est lorsque les images sont en 124*124px (pas de problème):

post-675012-0-81242000-1381671152_thumb.jpg

 

Et maintenant, voici un appaerçu de ce que ça donne quand je change la taille de l'image:

post-675012-0-97698400-1381671210_thumb.jpg

 

Link to comment
Share on other sites

Merci à Julien qui m'a donné la solution, je la c/c ici :

 

 

Bonjour,

 

Je viens de regarder votre site et il y a effectivement une hauteur qui est affectée aux éléments <li> des produits populaires. Comme la compression CCC des fichiers CSS est activée je ne peux pas vous dire dans quel fichier ni à quelle ligne il faut faire la modification mais il faut trouver ce morceau de code:

#featured-products_block_center li {

et y changer la valeur "height" en passant de 220px à 290px.

 

Pour le fichier qui gère la page d'accueil, je pense que c'est dans le module homefeatured.

 

Pour les autres pages (catégories, promo, recherche...) la modification à faire est la même, normalement dans le fichier product-list.css. Il faut modifier la valeur de "height de cet élément:

#product_list li {

 

  • Like 1
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...