Jump to content

Recommended Posts

bonsoir a tous

j'ai rien trouvé sur le sujet : quand je suis sur mon téléphone,  les produits sont affichés sur une seule colonne

et je voudrais au moins 2 colonnes

merci !

mon site = https://www.mini-meca-rc.com/

Share this post


Link to post
Share on other sites

Modifiez votre product-list.tpl

Vous devez avoir quelque chose qui ressemble à ça

{if isset($products) && $products}
	{*define number of products per line in other page for desktop*}
	{if $page_name !='index' && $page_name !='product'}
		{assign var='nbItemsPerLine' value=3}
		{assign var='nbItemsPerLineTablet' value=2}
		{assign var='nbItemsPerLineMobile' value=3}
	{else}
		{assign var='nbItemsPerLine' value=4}
		{assign var='nbItemsPerLineTablet' value=3}
		{assign var='nbItemsPerLineMobile' value=2}
	{/if}

 

Share this post


Link to post
Share on other sites

j'ai répondu trop vite ..... je fais quoi avec ça car j'ai bien ça dans mon TPL ?

Share this post


Link to post
Share on other sites

il faut mettre un col-xs-6 au lieu de 12 dans ce cas:

image.png.c47f9bf76214c0a06f3faca8840fdd91.png

Share this post


Link to post
Share on other sites
<li class="ajax_block_product{if $page_name == 'index' || $page_name == 'product'} col-xs-12 col-sm-4 col-md-3{else} col-xs-12 col-sm-6 col-md-4{/if}{if $smarty.foreach.products.iteration%$nbItemsPerLine == 0} last-in-line{elseif $smarty.foreach.products.iteration%$nbItemsPerLine == 1} first-in-line{/if}{if $smarty.foreach.products.iteration > ($smarty.foreach.products.total - $totModulo)} last-line{/if}{if $smarty.foreach.products.iteration%$nbItemsPerLineTablet == 0} last-item-of-tablet-line{elseif $smarty.foreach.products.iteration%$nbItemsPerLineTablet == 1} first-item-of-tablet-line{/if}{if $smarty.foreach.products.iteration%$nbItemsPerLineMobile == 0} last-item-of-mobile-line{elseif $smarty.foreach.products.iteration%$nbItemsPerLineMobile == 1} first-item-of-mobile-line{/if}{if $smarty.foreach.products.iteration > ($smarty.foreach.products.total - $totModuloMobile)} last-mobile-line{/if}">

Il y a normalement cette ligne dans votre fichier et vous voyez bien le col-xs-12 qui applique donc la règle d'usage des 12 colonnes de la grille comme cela est expliqué sur https://getbootstrap.com/docs/3.3/css/#grid

Share this post


Link to post
Share on other sites

Je vous ai fait la modif (plus un chouïa de css^^)

image.png.e397bd82371a1351bf9341a3c770ac2e.png

Share this post


Link to post
Share on other sites
il y a 2 minutes, Eolia a dit :

Je vous ai fait la modif (plus un chouïa de css^^)

image.png.e397bd82371a1351bf9341a3c770ac2e.png

c'est a dire ??

Share this post


Link to post
Share on other sites

Vous ne voyez pas de différence ???

 

Share this post


Link to post
Share on other sites

un question un peu plus général concernant l'affichage mobile = tout est modifiable ?

par exemple la taille de la case AJOUTER AU PANIER est trop grosse ...

Share this post


Link to post
Share on other sites

oui regardez du côté des à @media queries css

Share this post


Link to post
Share on other sites

si quelqu'un a la réponse ... ça m’arrangerait :wub:

c'est trop compliqué pour moi ☺️

 

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.


×
×
  • Create New...

Important Information

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