Affichage d'images multiples sur une page produits

Bonjour,

Sur tous mes produits, j'ai spécifié une taille d'image de 370px en largeur et 300px en hauteur. Cependant, comme il s'agit de tirages de photos avec des formats d'image très différents, pour les images en format vertical ça ne pose aucun problème, mais certaines photos ayant un format horizontal panoramique, cela laisse parfois un vide très important entre l'image principale affichée et les images miniatures en-dessous (voir capture d'écran).

Y a-t-il un moyen pour que les images miniatures soient placées systématiquement juste en-dessous de l'image principale, afin d'éviter qu'apparaisse cet espace vide pas très esthétique ?

De plus, comme tous mes produits ont des variantes (taille du tirage et prix), quand on sélectionne une variante, l'image miniature active n'est apparemment plus considérée comme active, et la bordure de 1 pixel autour disparaît, pour réapparaître dès que l'on survole à nouveau la miniature.

Visuellement, c'est très génant, car ça provoque un décalage de deux pixels (1 au dessus et 1 en dessous de la miniature) pour tout ce qui se trouve en dessous de l'image dans la page produit.

Comment peut-on remédier à ça ?

Désolé, j'avais oublié de joindre la capture d'écran...

Bonjour,

Malheureusement, le code css que vous m'avez donné pour enlever l'espace vide entre la photo et les images miniatures ne fonctionne pas : les miniatures se retrouvent sous l'image principale (et dépassent à peine au dessus de celle-ci), et le texte en dessous se retrouve lui aussi décalé vers le haut, en partie caché par l'image (voir capture d'écran)... Y a-t-il une autre solution ?

Pour les images "déselectionnées" en cas de variantes, je vais essayer de mettre ça en place et voir ce que ça donne.

Bonjour Nicolas,

Je m'aprête à installer la version 1.6 (j'ai actuellement la 1.5.9) pour essayer de régler le problème des images "désélectionnées", en suivant votre conseil. Cependant, quelle est la bonne méthodologie pour ne pas perdre toutes les modifications (apparence, présentation, fonctionalités, sans compter ce que vous avez peut-être fait au niveau du back-end de votre côté) que j'ai déjà effectuées sur ma version actuelle ? Autrement dit, ma crainte est d'avoir à passer de longues heures à refaire ce que j'ai déjà fait, pour régler un problème génant visuellement, mais mineur ?

Merci de m'indiquer la marche à suivre s'il y en a une...



digitalartconcept.com/version2/index.php/online-store

Bonjour,

Pour régler le problème de décalage des images évoqué dû à la bordure des vignettes qui disparaît quand on sélectionne une caractéristique (et qui réapparaît quand on survole une vignette, ce qui provoque le décalage de 1 pixel de tout le texte qui se trouve en dessous, dans un sens et dans l'autre), j'ai suivi votre conseil donné plus haut :

"Pour le fait que les images soit "déselectionnées" lors du changement de variante, avec la 1.6.0 et en ajoutant une entrée variant_increase_pref avec la valeur 1 dans la table hikashop_config via phpmyadmin, vous activerez l'optimisation d'affichage des variantes sur la page produit qui devrait résoudre cela automatiquement."

Dans phpmyadmin, il y avait déjà une entrée variant_increase_pref, avec une config_value=0 et une default_value=1. J'ai donc changé la config_value à 1, mais ça n'a strictement rien changé.

De plus, depuis que j'ai installé la 1.6.0, certains produits (une petite minorité seulement, mais sans que rien ne les distingue des autres au niveau de la présentation - et ce n'était pas le cas avant) présentent un problème similaire dès qu'on arrive sur la page du produit principal : dans ce cas-là, la bordure est présente sur la vignette de l'image principale, mais dès qu'on passe sur la deuxième ou la troisième vignette, tout le texte placé en dessous se décale de 1 pixel vers le bas (puis vers le haut lorsque l'on repasse sur la première vignette). Le problème de la bordure absente dès qu'on sélectionne une variante existe aussi pour ces produits-là.

Exemple de produit qui présente cette particularité :http://digitalartconcept.com/index.php/online-store/produit/4-aston-martin-vantage/category_pathway-13

C'est un problème mineur, mais qui est très gênant visuellement, et qui ne fait pas très professionnel.

Avez-vous d'autres suggestions ?

Bonjour,

J'ai rajouté #hikashop_product_image_main{height: 320px;} au css de mon template, mais ça ne change strictement rien au problème, je l'ai donc à nouveau enlevé.

Avez-vous d'autres suggestions ?