Zmiana liczby kolumn dla mobilnego widoku

[cel3ct]

Presta 1.6

Nie mogę sobie poradzić ze zmianą liczby kolumn na liście produktów dla mobilnego widoku. Aktualnie na telefonie wyświetla mi się jedna kolumna, a chciałbym to zmienić na dwie.

Oto co zmieniłem, ale i tak nie pomogło.

product-list.tpl

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

<li class="ajax_block_product{if $page_name == 'index' || $page_name == 'product'} col-xs-6 col-sm-3 col-md-3{else} col-xs-6 col-sm-3 col-md-3{/if}{if $smarty.foreach.products.iteration%$nbItemsPerLine == 0}

 

 

Edited September 26, 2018 by cel3ct (see edit history)

[() Maciej ()]

Za wyświetlanie strony odpowiada CSS, a konkretnie "Media". Możesz sobie pisać co chcesz w JS, czy PHP, a i tak CSS sformatuje stronę po swojemu.

Poprawki masz nanieść w pliku theme.css (presta 1.7), albo global.css (presta 1.6)

Edited September 26, 2018 by () Maciej () (see edit history)

[cel3ct]

A co dokładnie należałoby zmienić? Trochę tych "media" w global.css jest.

E:

Poradziłem sobie.
W product_lis.css wywaliłem:

@media (max-width:410px){
    ul.product_list.grid > li, ul.product_list.grid .owl-item .ajax_block_product{float:none;width:50%;}
}

a w product-list.tpl zmieniłem:

<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-4 col-md-3{/if}{if $smarty.foreach.products.iteration%$nbItemsPerLine == 0} 

na:

<li class="ajax_block_product{if $page_name == 'index' || $page_name == 'product'} col-xs-6 col-sm-4 col-md-3{else} col-xs-6 col-sm-4 col-md-3{/if}{if $smarty.foreach.products.iteration%$nbItemsPerLine == 0} 

 

Edited September 28, 2018 by cel3ct (see edit history)