Помощь Вывод кол-ва "последних" товаров в зависимости от разрешения экрана

Тема в разделе "Opencart", создана пользователем ggnk, 14 июл 2015.

Информация :
Внимание форумчане! При создании тем, или выкладывании какой-либо информации проверьте в какой ветке форума вы находитесь! Не путайте Opencart и Opencart2. При несоблюдении данного условия выносится соответствующее наказание! И потом не говорите что вас НЕ ПРЕДУПРЕЖДАЛИ! По возможности используйте обменники mail, yandex, google, dropbox, rghost Дабы избежать просьб перезалить и проблем с рекламой!
Модераторы: ZiX
  1. ggnk

    ggnk

    Регистр.:
    30 ноя 2008
    Сообщения:
    238
    Симпатии:
    25
    Всем доброго времени суток!
    Имеется модуль последние ( latest ) в админке ocStore (v1.5.4.1), в этом модуле можно задать количество выводимых товаров:
    [​IMG]

    Ширина блока с контентом, в котором реализован вывод этого модуля - тянется в зависимости от разрешения.

    Как сделать вывод последних товаров нефиксированного размера - таким образом, чтоб выводилось то кол-во товаров, которое позволяет разрешение экрана посетителя. Верстка резиновая и на минимальном разрешении в одном ряду помещается 3 товара, а на максимальном - 4 товара. Если задать в админке через настройку модуля 3 товара, то получается на широких разрешениях пустота в последней колонке модуля. Если в настройках указать вывод 4-х товаров, то модуль будет хорошо смотрется на широком экране (ряд заполнен), но на разрешении менее 1600px будет выводится в два ряда и второй ряд будет заполнен лишь частично.
    Нужно, чтоб модуль сам высчитывал сколько товаров показать.
    вот так выглядит вывод модуля на обычном экране:
    [​IMG]

    А вот так выглядит вывод модуля на широком экране, ряд получается заполнен не до конца:
    [​IMG]


    Посоветуйте, решать этот вопрос средствами CSS/Javascript или есть какое-то общеизвестное решение?
     
  2. eanknd

    eanknd Создатель

    Регистр.:
    4 апр 2014
    Сообщения:
    21
    Симпатии:
    10
    средствами css:

    overflow: hidden;
    display: block;
    width: 2024px /* ставьте нужное Вам */

    Можете прикрутить карусель, например, OwlCarousel, тогда можете задать лимит хоть 10 товаров и видны будут все при прокрутке.
     
    Последнее редактирование: 14 июл 2015
    ggnk нравится это.
  3. ggnk

    ggnk

    Регистр.:
    30 ноя 2008
    Сообщения:
    238
    Симпатии:
    25
    Про оверфлоу хидден сразу подумал, но сомневался не будет ли горбылей при масштабировании.
    А вот OwlCarousel это интересно. Её можно юзать многократно на одной странице? Например, сверху карусель лидеров продаж, снизу последних поступивших?
     
  4. eanknd

    eanknd Создатель

    Регистр.:
    4 апр 2014
    Сообщения:
    21
    Симпатии:
    10
    Если будете использовать OwlCarousel, то overflow:hidden по-любому будет нужен. У меня на главной стоит на разных модулях, использую Bootstrap, при масштабировании все норм, однако не знаю как поведут себя те же модули в левой/правой колонке, будут ли отображаться товары каруселью или будут видны все товары, нужно со стилями будет поэкспериментировать.
     
    ggnk нравится это.
  5. ggnk

    ggnk

    Регистр.:
    30 ноя 2008
    Сообщения:
    238
    Симпатии:
    25
    С этим вопросом в принципе все понятно,
    я сейчас на сайте сделал так:
    HTML:
    #content .latest-prod {height:287px;overflow:hidden;display:block !important;} 
    Всё работает на разных разрешениях. Вывод в сайдбаре не задевает, ибо обозначил родительский #content, а в сайдбаре #column-left.

    Было бы здорово ещё разобраться как менять на лету кол-во товаров, выводимых на витрину.
    [​IMG]
    А то в одном случае товаров по 4 в ряд, а в другом по 3 и если выбрать число не кратное обоим , то в случае разбивки категории на страницы будет оставаться одно свободное место в конце.
    12 товаров на странице для данного сайта это мало, а 24 уже много.
    Есть идеи как "на лету" менять? Я сначала подумал на vqmod потом его отбросил, он ведь не будет срабатывать при изменении размера окна. А javascript опять же работает только на клиентской части и не может влиять на разбивку на страницы. Остается ajax ? Или это гиблое дело?
     
  6. Mihael-Vlz

    Mihael-Vlz Постоялец

    Регистр.:
    22 дек 2007
    Сообщения:
    69
    Симпатии:
    8
    А ajax по Вашему это не javascript? ajax это всего лишь метод из javascript. Тут только если скрипт на javascript писать, чтобы он получал и делил ширину контент блока на ширину блока товара, а затем лишние отсекал.
    Например на десктопе будет, 800px / 200px = 4 блока, а на мобильнике 400px / 200px = 2 блока. Лишние блоки просто скрываем методом javascript или CSS.
     
  7. ggnk

    ggnk

    Регистр.:
    30 ноя 2008
    Сообщения:
    238
    Симпатии:
    25
    если так сделать, то при переходе на вторую страницу - не будет тех товаров, которые были скрыты на первой.

    Про ajax я имел ввиду родную пагинацию из opencarta заменить разбивкой на страницы ajax-ом
     
  8. Mihael-Vlz

    Mihael-Vlz Постоялец

    Регистр.:
    22 дек 2007
    Сообщения:
    69
    Симпатии:
    8
    К сожалению с пагинацией и кол-вом товаров на странице ничего адекватного не сделать, просто смириться. Если неймется, то можно городить огород и сделать всю пагинацию из javascript, чтобы он подсчитывал свободные места при каждом разрешении и подгружал весь контент на ajax. Но стоит ли овчинка выделки? Думаете покупатель будет зацикливаться на этом пустом блоке? Главное в магазине концентрироваться на прибыли, а не на всяких мелочах. Сам раньше занимался всякими мелочами и понял, что концентрироваться нужно совсем на другом, так как потраченное время вряд ли окупится в итоге.
     
    ggnk нравится это.
  9. Mihael-Vlz

    Mihael-Vlz Постоялец

    Регистр.:
    22 дек 2007
    Сообщения:
    69
    Симпатии:
    8
    У себя сделал так, сделал 3 ширины сайта методом CSS min-width & max-width, подсчитал кол-во блоков при каждой ширине, получилось что в самом широком варианте сайта 4, в среднем (для планшетов) 3, в последнем (для мобил) 2 и вычислил, что оптимальное кол-во товар на странице 24, не много и не мало.
     
  10. ggnk

    ggnk

    Регистр.:
    30 ноя 2008
    Сообщения:
    238
    Симпатии:
    25
    у меня так же реализовано, только 12 вместо 24. Когда ставлю 24, то на минимальном разрешении огромная пустующая полоса в сайдбаре.