Jump to content

Affichage des produits sur plusieurs colonnes dans les catégories


Recommended Posts

Bonjour!
ma question est simple,
Je voudrais savoir si quelqu'un travail sur un module que permet l'affichage des produits en plusieurs colonnes?

Comme sur ce site http://www.bagatelles.fr/

Je sais bien sûr que c'est possible puisqu'ils l'ont fait!!!! mais apparemment c'est très compliqué!!!

Si il pouvait y avoir une solution pas trop ardu pour un non programmeur, ce serait cool non?
Merci!

Link to comment
Share on other sites

Excellente idée! Imaginez plusieurs catégories (7), chacune deux sous catégories, ensuite deux sous sous catégories contenant environ chacune 350 articles. La présentation sur 3 colonnes permettrait de ne pas avoir des listes à rallonge. Si quelqu'un à la solution, je suis preneur également.

Link to comment
Share on other sites

Bonjour à tous,
je cherche à mettre en page la présentation des produits. Je souhaiterai avoir deux colonnes (voire trois même, pourquoi pas) au lieu d'une seule car lorsque l'on a beaucoup de produits dans une catégories ça fait une longue liste pas très agéable à parcourir.
J'ai cherché dans les fichiers tpl, le product.tpl et le product-list.tpl.
Pour le moment je ne vois pas comment m'y prendre, si quelqu'un à des infos à ce sujet, ça m'intéresse.
Merci

Link to comment
Share on other sites

Bonjour

Les listes de produits sont présentées en listes XHTML avec des mises en forme CSS ; il "suffit" donc d'appliquer des règles à ce niveau (pour faire très très bref : largeur et hauteur de chaque élément LI fixes avec des largeurs qui seront des diviseurs de la largeur de ta zone d'affichage, et propriété "float:left" pour ces derniers, tout ceci au niveau CSS...)

Voili voilou

Link to comment
Share on other sites

Appliquer es règles au niveau de chaque élément LI fonctionne parfaitement; après quelques réglages avec CSSedit et avec l'aide de Firebug, sous Safari c'est nickel, Firefox idem, mais pas avec Ie (je m'y attendais un peu). Dois-je aller dans le tpl pour régler ça ou bien y a t il une astuce pour Ie?

Alors j'édite ce post parce que j'ai mieux relu le conseil de Cedric : hauteur et largeur fixe!!
Voilà d'ou vient le bug sous Ie.

Tant pis, je mettrais pas "résolu" puisque on a fusionné mon topic avec celui là...Mais résolu quand même!

Link to comment
Share on other sites

En fait ce qui m'a géné c'est le fait que je n'avais pas défini une hauteur, du coup, sous Ie tous les articles se surperposaient au lieu de s'afficher en trois colonnes comme souhaité. Largeur totale/par le nombre de colonne (prévoir les marges et les espaces), par contre la hauteur avec certains navigateurs n'est pas importante, mais sous Ie, on dirait que c'est primordial; merci Microsoft de faire compliqué quand on peut faire simple.

Merci Cédric pour les conseils.

Link to comment
Share on other sites

  • 7 months later...

Bonjour Ganeish,

J'essaie d'avoir un rendu de ma liste de produit sur 3 colonnes, ce que j'ai réussi à faire, par contre, j'ai un problème pour la hauteur des articles du coup quand un article est soldé tout se décale. Avez-vous trouvé une solution ou savez vous où déterminer une taille maximale pour une "case" article ?

Merci d'avance pour l'information, car j'ai essayé de glissé une taille à pas mal d'endroit ça ne marche pas.

Link to comment
Share on other sites

  • 1 month later...
  • 2 months later...
  • 1 month later...

J'utilise, pour plus de simplicité, l'affichage des produits phare mais il est tout à fait possible de présenter les produits sous cette forme (produits par colonne comme le site d'exemple).
C'est juste de la CSS.

Link to comment
Share on other sites

je suis dessus depuis hier. J'ai réussi à afficher les produits sous forme de carré mais j'arrive pas à faire plusieurs colonne.
ça te dérangerais pas de m'indiquer ou je dois intervenir dans le CSS s'il-te-plais ?

Link to comment
Share on other sites

  • 10 months later...

Bonjour,

Mettre le homefeatured en colonne est avant tout une affaire de css.
En premier: direction le homefeatured.tpl et assigner le nombre de case par ligne que l'on souhaite "{assign var='nbItemsPerLine' value=2}"
Ensuite si nous jetons un coup d'oeil à notre page nous constatons que nous avons un

  • encadrant des
  • qui elle s'affichent en colonne.
    Si la colonne centrale fait 550px, il ne tiendra à l'intérieur que 2 rangées de
  • d'environ 220 à 230px de large (en fonction des margins et paddings que l'on fixera pour écarter les
  • les une des autres.

    Donc dans un premier temps on fixe les largeurs des
  • à 230px. Vos cadres vont automatiquement se mettre par deux et par rangées.(S'ils sont les uns au dessous des autres c'est que votre largeur de
  • est trop importante)

    Ensuite Firebug et css pour aligner les texte, photos, prix, boutons et c'est pas le plus simple!
    Ne pas oublier également dans le homefeatured.tpl de mettre à jour cette ligne: "{assign var='liHeight' value=260}"
    Ici la valeur "260" est la hauteur de
  • et c'est à partir de cette hauteur que la hauteur de
    • sera calculée automatiquement.

      Bon courage et Cordialement
Link to comment
Share on other sites

  • 3 months later...

ok merci.

en fait je croyais que ta première réponse concernait le sujet de ce post, à savoir plusieurs colonnes de produits dans les pages catégories. Mais pour moi c'est ok, j'ai réussi mes 3 colonnes de produits. Il me reste à vérifier avec les autres navigateurs.

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...