Jump to content
Enduro

Theme responsive problème nombre de produit par ligne suivant taille écran

Recommended Posts

Bonjour,

 

Je modifie actuellement un thème responsive dont j'ai un problème avec les produit en colonne pour les tailles d’écran avec une largeur de 768 px à 1136 px 

 

A la base le thème pour le homefeatured, product-list, new-product,... ont un nombre de produit par ligne de 3 produits, je l'ai modifié pour mettre 4 produits par ligne.

 

Mais cela cause un problème d'affiche pour les tailles d'écran de 768 px à 1136 px.

 

Avec 4 produits par ligne j'ai sur la première ligne 3 produits, sur la seconde ligne 1 produit, sur la troisième ligne 3 produits,...

 

la solution serait de mettre une condition de ce type dans le tpl

 

si la taille d'écran est compris entre 768 px et 1136px

{assign var='nbItemsPerLine' value=3}
fin de condition

 

Si la taille d'écran est supérieur à 1136 px

{assign var='nbItemsPerLine' value=4}

fin de condition

 

Je ne connais pas cette condition ou comment l'écrire si elle existe, merci pour votre aide.

Share this post


Link to post
Share on other sites

Il n'est pas possible de mettre des conditions de ce type dans le .tpl

Le responsive se fait en CSS à l'aide de media query.

Donc, selon la condition (largeur de l'écran), vous devez jouer avec la largeur de vos blocs produits pour en afficher X sur une ligne.

Edited by Szed (see edit history)

Share this post


Link to post
Share on other sites

Merci pour votre réponse, cela m'évite de chercher une condition qui n'existe pas ce qui est bien dommage...

 

Ce sera donc sur deux colonnes pour ces largeurs

Share this post


Link to post
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...

Important Information

Cookies ensure the smooth running of our services. Using these, you accept the use of cookies. Learn More