Количество товаров в зависимости от разрешения экрана

У меня формируется список товаров с помощью mfilter2. Вывод таблицы в десктопной и мобильной версии отличается, т.к. в мобильной строка с заголовком не помещается на экране, было принятно решение сделать её столбцом.
В десктопной версии выводится по умолчанию 10 товаров. В мобильной в зависимости от разрешения экрана должно быть 768px — 5, ниже ширина — меньше товаров, 320px — 2.
Попытался сделать так (хотя бы 5 сначала выводить на всех мобильных разрешениях):

{if 'mobile' | mobiledetect}
        {set $limit = 5}
    {/if}

    {if 'standard' | mobiledetect}
        {set $limit = 10}
    {/if}

        [[!mFilter2?
            &limit=`{$limit}`
            &tpl=`type-item`
		...
        ]]

Но не работает. В мобильной версии выводит всё равно 10. Следующие 5 (3, 2) столбца товаров ниже.
Как сделать, чтобы работало, как должно быть?

— это десктопная версия

— мобильная

Владимир

21 января 2019, 17:27

1 527

Комментарии: 10

vectorserver

21 января 2019, 20:35

Почитай про media queries css
getbootstrap.com/docs/4.2/layout/overview/
У меня на сайте к примеру в мобиле, корзина из таблицы превращается в display block
lovimgotovim.ru/

Konstantin

21 января 2019, 20:43

Но не работает. В мобильной версии выводит всё равно 10

Ошибка в вызове фильтра. И вообще, раз юзаете феном – юзайте везде.
Вот так заработает:

{'!mFilter2' | snippet : [
    'limit' => $limit,
    'tpl' => 'type-item'     
    ...      
]}

vectorserver

21 января 2019, 20:47

Это лишняя нагрузка на фреймворк, можно css обойтись

Konstantin

21 января 2019, 20:51

в 0.0001с?
Вообще не вижу разницы, наоборот лень цсс для этого писать.

vectorserver

21 января 2019, 20:56

иногда 0.0001 сек важна очень, не сужу просто я ищу всегда оптимизацию))))

Konstantin

21 января 2019, 20:57

иногда 0.0001 сек важна

Согласен. И если разницы нет, то предпочту такой вариант написанию нескольких строк цсс.

Konstantin

21 января 2019, 20:49

P.s.
Еще раз прочитал вопрос, и понял что и это не поможет. Параметр limit ограничивает количество результатов на странице, но надпись «всего результатов» не исчезнет, их же 20. Или используйте msProducts, или в чанке скрывайте упоминания о количестве и пагинацию.

Владимир

21 января 2019, 23:02

надпись «всего результатов» не исчезнет

Речь не о надписи, а о самой таблице товаров.

скрывайте упоминания о количестве

я так и делаю в мобильной версии.

Владимир

21 января 2019, 23:02

Вот так заработает:

{'!mFilter2' | snippet : [
    'limit' => $limit,
    'tpl' => 'type-item'     
    ...      
]}

Завтра на работе попробую этот вариант. Спасибо.

Владимир

22 января 2019, 17:32

Завтра на работе попробую этот вариант. Спасибо.

Написал так. Но limit не работает.

{if 'mobile' | mobiledetect}
        {set $limit = 5}
        {$limit}
    {/if}

    {if 'standard' | mobiledetect}
        {set $limit = 10}
        {$limit}
    {/if}

    {$limit}

И в десктопной, и в мобильной версии выводит 5 10 10

Авторизуйтесь или зарегистрируйтесь, чтобы оставлять комментарии.

Количество товаров в зависимости от разрешения экрана

Комментарии: 10

Здесь упомянуты