[RESOLU] Elements bizarre au dessus des miniatures produits...

[yvesbj]

Bonjour,

 

Dans la page produit, au dessus des miniatures, une zone (en jaune sur ma capture) me pose des petits problèmes.

 

En gros j'aimerais pouvoir agrandir cette zone en largeur mais je ne sais pas ou intervenir pour le faire.

 

Pourquoi ? Parce que j'ai agrandi mes miniatures de 80x80px avant à 98x98px maintenant et la dernière image passe toujours à la ligne. Apparemment, ce serait à cause de cette zone qui ne serait pas modifiable en CSS.

 

Cela fais déjà bien 10 heures depuis hier que je suis dessus, j'ai fouillé le forum et tout mais rien n'y fais.

 

Je vous en supplie, je suis épuisé, est-ce que vous pouvez m'aider s'il-vous-plais ?

[surfshop]

Bonjour a tu essayé de modifier la width dans :

 

#thumbs_list {
float: left;
overflow: hidden;
width: 255px;

 

 

ligne 1190 du global.css

[yvesbj]

Merci pour ta réponse surfshop. Oui j'ai essayé ça. Mais bon, comme on peut le voir sur la capture,sur firebug, l'élément fais appel à autre chose... Peut être qu'il faut modifier le product.tpl mais je sais pas du tout ou.

 

Voici déjà mon code css :

 

/* views block */
#views_block {
margin: 0 auto;
width: 360px
}
#thumbs_list {
overflow: hidden;
float: left;
width: 330px;
height: 110px;
margin-right: -4px;
margin-bottom: 15px; 
}
#thumbs_list ul {
padding-left: 1px;
list-style-type: none;
margin-top: 10px
}
#thumbs_list li {
float: left;
cursor: pointer;
   margin-right: 11px;
margin-left: 1px;
border: #C8C8C9 solid 1px;
height: 98px;
width: 98px;
}
#view_scroll_left, #view_scroll_right {
background: url('../img/thumbs_left.gif') no-repeat center;
text-indent: -3000px;
width: 9px;
height: 18px;
float: left;
margin-top: 45px;
padding-right: 4px;
padding-left: 4px
}
#view_scroll_right { background-image: url('../img/thumbs_right.gif') }
span.view_scroll_spacer {
float: left;
width: 17px;
height: 80px
}

 

S'il vous plais aidez moi, je cherche encore la et c'est une torture pour moi...

[yvesbj]

Aaaaahhhh ! Je m'arrache les cheveux, je vous en supplie aidez moi s'il-vous-plais !!!

[Jacques Biais]

Bonjour,

 

"element style" veut dire que les propriétés css de cet élément ne figurent pas dans un fichier css mais directement dans le code de la page.

 

Ex: <div style="width:683px;">

 

Il faut tout simplement rechercher dans la page quel est l'élément qui un "width" de 683px et modifier cette largeur à ta convenance.

[yvesbj]

Oui effectivement je sais bien, j'ai effectué une recherche sur l'ensemble du site et il ne trouve pas 683px. Je ne pense pas que ce soit une valeur fixe. Mais en gros, mon problème, c'est surtout que la dernière miniature produit (thumb), descend automatiquement à ligne. C'est à dire, j'ai 3 miniatures, la 3ème descend, j'en ai 4, la 4ème descend, etc. C'est en modifiant cette élément sur firebug que j'ai constaté que les miniatures ce remettaient correctement.

 

Mes modifications se résume à un agrandissement des miniatures de 80x80px à 98x98px ainsi qu'un espacement de 10px entre elle et un contour de 1px.

 

Je suis encore resté la mâtiné dessus à chercher ou effectuer la modification mais je suis revenu encore bredouille...

[Divine]

Bonjour,

 

Tu pourrais nous indiquer l'url de ton site ?

[yvesbj]

Merci pour ta réponse Divine. J'ai eu cette réponse sur le forum anglais :

" Don´t worry, that is because there is a property in the slider that isn´t defined in css, but it is defined in product.tpl

 

Now i can´t have access to prestashop files, but in product.tpl there should be commands for smarty that assigns the width property for "ul" with the id:thumbs_list_frame.

The value is calculated depending the quantity of images and estimating a width of 80 px.

 

As you have changed the width of the images,now you should change the value in product.tpl

 

Hope it works! "

 

Ça semble logique mais je n'ai cependant pas les connaissances nécessaires afin d'effectuer cette modification. Pourtant, j'ai essayé, encore et encore mais en vain

 

Pourriez vous m'aider svp ? Je vous joint mon fichier product.tpl.

product.zip

[Divine]

Est-ce que tu as agrandi tes miniatures uniquement dans ton fichier css ou bien également dans la configuration des images de ton site ?

[yvesbj]

J'ai modifié la taille des miniatures à partir de l'admin et j'ai également fais mes modifications dans le CSS comme cité plus haut.

 

Apparemment, d'après ce qu'on m'a expliqué sur le forum anglais, c'est le fichier product.js qu'il faut modifier. Cette ligne plus précisément :

 

	{
	var thumb_width = $('#thumbs_list_frame >li').width()+parseInt($('#thumbs_list_frame >li').css('marginRight'));
	$('#thumbs_list_frame').width((parseInt((thumb_width)* i) + 3) + 'px'); //  Bug IE6, needs 3 pixels more ?
}

 

Je n'ai pas les compétences nécessaires pour le faire, pourriez vous m'aider svp ?

[yvesbj]

Merci beaucoup à vous tous pour votre aide. J'ai trouvé la solution grâce au forum anglais.

 

Le soucis venait de l'espacement entre les miniatures.

 

Il fallait donc modifier le fichier product.js en remplacement la ligne ci-dessous :

var thumb_width = $('#thumbs_list_frame >li').width()+parseInt($('#thumbs_list_frame >li').css('marginRight'));

 

par :

var thumb_width = $('#thumbs_list_frame >li').width()+parseInt($('#thumbs_list_frame >li').css('marginRight'))*2;