Jump to content

1.99.6 vamshop4 - отображение корзины в формате сотового


Recommended Posts

image.png

При работе с сотового корзина выходит за пределы экрана.

Будут исправления ?

image.png

Link to post
Share on other sites
support
20 минут назад, EdZa сказал:

image.png

При работе с сотового корзина выходит за пределы экрана.

Будут исправления ?

image.png

В будущих версиях - возможно.

Но таблица со всеми товарами всё равно в 360 пикселей не влезет нормально.

Хоть адаптивная таблица будет, хоть неадаптивная.

Link to post
Share on other sites
support

Пример страницы корзина есть в http://demo2.vamshop.ru

Там сттаница сделана адаптивной таблицей.

и всё равно не влезет ничего толком в 360 пикселей.

Link to post
Share on other sites

как минимум добавить

Across every breakpoint, use .table-responsive for horizontally scrolling tables.

<div class="table-responsive">
</div>

Тогда хоть экран корежить не будет, а прокрутка появится.

Link to post
Share on other sites
support
41 минуту назад, EdZa сказал:

как минимум добавить

Across every breakpoint, use .table-responsive for horizontally scrolling tables.

<div class="table-responsive">
</div>

Тогда хоть экран корежить не будет, а прокрутка появится.

Хорошо, посмотрим.

Но на таких маленьких экранах таблицу широкую нормально не покажешь.

Прокрутка - это тоже, так себе, удовольствие, когда у тебя 360px в ширину.

Link to post
Share on other sites
  • 4 months later...
В 09.07.2019 в 14:39, EdZa сказал:

image.png

При работе с сотового корзина выходит за пределы экрана.

Будут исправления ?

image.png

Сделал адаптивную таблицу + не показывает некоторые колонки на маленьких экранах.

Сейчас выглядит неплохо.

Вот исправленный файл /templates/vamshop4/module/order_details.html

Вот как выглядит, скрины.

 

Screenshot from 2019-11-24 21-30-20.png

Screenshot from 2019-11-24 21-30-25.png

order_details.html

Link to post
Share on other sites
3 минуты назад, KoVaLsKy сказал:

да зачем table-responsive, когда можно на col-* сверстать. Заменить td на div и все.

Лично моё imho, что таблица должна оставаться таблицей.

Страница корзины больше на таблицу похоже, заголовки, колонки, строки.

Хотя, по большому счёту, не принципиально, понятно, что можно и адаптивными css классами bootstrap сделать.

Link to post
Share on other sites
  • 2 weeks later...
Роман_DD
В 26.11.2019 в 17:01, KoVaLsKy сказал:

да зачем table-responsive, когда можно на col-* сверстать. Заменить td на div и все.

ВОТ! А таблица не нужна там совсем уже давно.

Link to post
Share on other sites
15 минут назад, Роман_DD сказал:

ВОТ! А таблица не нужна там совсем уже давно.

Дело не в таблице, а в ширине экрана. Слишком мало места по горизонтали на смартфонах.

Вот посмотрите пример на https://vamhost.ru

Там максимально всё убрано и нет таблиц.

Но всё равно не влазит, 950 сумма всё равно чуть вылазит.

А ещё и атрибуты будут, то тем более не влезет.

Screenshot from 2019-12-06 15-25-11.png

В общем, я постараюсь как-то впихнуть всё ровно, но это не так просто.

 

Link to post
Share on other sites
Роман_DD
17 минут назад, support сказал:

Дело не в таблице, а в ширине экрана. Слишком мало места по горизонтали на смартфонах.

Вот посмотрите пример на https://vamhost.ru

Там максимально всё убрано и нет таблиц.

Но всё равно не влазит, 950 сумма всё равно чуть вылазит.

А ещё и атрибуты будут, то тем более не влезет.

Screenshot from 2019-12-06 15-25-11.png

В общем, я постараюсь как-то впихнуть всё ровно, но это не так просто.

 

На вскидку - слово Количество не нужно, все и так давно знаю что это количество.

Картинку большой и НАД количеством а не сбоку.

Цену отдельной строкой

Опции отдельной строкой. 

Ну не строкой, а колонкой скажем ил дивом который будет вниз под другой уползать. placement: float-left и что то там про flex.

Я не особо шарю, но вы попробуйте не в браузере, а в программе stylizer там демка есть, в ней все намного намного проще и очевиднее чем в режиме разработчика ковыряться...

Единое правило для мобильной верстки - ввниз юзер готов листать пальцем бесконечно, все ленты новостей бесконечные сейчас, инстаграм бесконечный.

ВБОК ЮЗЕР ЛИСТАТЬ НЕ ХОЧЕТ И НЕ ДОЛЖЕН! На телефоне информация вертикально доллжна быть. К тому же улучшаются ПОВЕДЕНЧЕСКИЕ ФАКТОРЫ  для ПС ЯНДЕКС. (время на странице, скрол!)

Все остальное отлично, но от таблицы придется избавиться  :)) Я понимаю, это такое легаси, которое жалко бросать, сколько времени убито на доведение таблицы до идеала, но всему приходит конец и таблицам в том числе :)

Я думаю правильнее всего, показывать товар в корзине в том же блоке, как он идет в products_listing. Тогда будет сохранен единый стиль и не будет травмы у покупателя, просто добавить туда сумму и все. 

 

Link to post
Share on other sites

Ну насчёт бесконечного скролла вниз - это конечно спорный очень момент.

Все слайдеры, тот же интаграм вбок листается и не вниз.

Так что прям стремиться к рокрутке вниз тоже не нужно, imho

Вот например в vamshop4 шаблон на главной странице слайдера сделаы, они ж вбок листают.

Если не делать листалку вбокс, а просто вниз выстраивать, тогда замучаешься листать вниз.

А так сразу понятно, вот новинки, полистал слайдер вбок, вот отзывы, полистал слайдер вбок.

Ну это моё мнение, лично мне так удобнее.

В шаблоне vamshop1 сделано именно прокруткой вниз, а не слайдером, и на мой вкус, не очень, когда просто вниз и вниз листаешь и не видишь, что это ты крутишь, сдкидки, новинки, или что-то ещё.

 

Вот внутри категории да, когда понятно, что ты в списке товара находишься, там нет слайдера, там просто карточки товара и ты вниз листаешь.

 

Link to post
Share on other sites
Роман_DD

Вбок картинки, потому что это как смахивать, то что надоело смотреть. А вниз это интересно больше инфорации. Наверное такая логка. Вобщем вбок толжно в любом случае слайдами листаться, а не скроллом. 

 

Но да, слайдеры для главной больше годятся, но опять же , это мы элементы листаем однородные. в корзине это никак не применить. Вся инфорация должна умещаться на одном экране, ну и не забываем, что соотношение сторон у мобильника сейчас 16/9 или окло того... по вертикали почти в 2 раза больше места. 

Вообще по умолчанию там если вы обратите внимание, то padding одчень большой, что в листинге на мобиле, что в корзине, получается теряется место горизонтальное из-за отступов.

Link to post
Share on other sites
1 час назад, Роман_DD сказал:

Вообще по умолчанию там если вы обратите внимание, то padding одчень большой, что в листинге на мобиле, что в корзине, получается теряется место горизонтальное из-за отступов.

Буду вносить правки.

Думаю, что всё реально, можно всё сделать и без прокрутки.

 

Link to post
Share on other sites

Что-то нормально корзина не получается, что б и на компе и на мобилке нормально выглядело, если убрать всё лишнее, что б влазило на мобилку, тогда на компе слишком много места пустого.

Сейчас попробую корзину сделать плитками, как товар внутри категории например тут - http://demo.vamshop.ru/smartphones.html

А что, довольно прикольно получается корзина плитками, необычно и довольно удобно. Наверное так и сделаю.

Сейчас покажу, залью на demo.vamshop.ru

И выглядит нормально, без прокруток, на мобилках, и на компах.

7 часов назад, Роман_DD сказал:

Вообще по умолчанию там если вы обратите внимание, то padding одчень большой, что в листинге на мобиле, что в корзине, получается теряется место горизонтальное из-за отступов.

 

Link to post
Share on other sites
9 часов назад, Роман_DD сказал:

Я думаю правильнее всего, показывать товар в корзине в том же блоке, как он идет в products_listing. Тогда будет сохранен единый стиль и не будет травмы у покупателя, просто добавить туда сумму и все. 

 

Вот как получилось.

Влазит и на компе и на смартфоне.

http://demo.vamshop.ru

Можно "в-живую" посмотреть.

Screenshot from 2019-12-07 00-44-03.png

Screenshot from 2019-12-07 00-44-12.png

 

 

Прицепил два файлы.

Исправленный /templates/vamshop4/module/order_details.html

и новый файл /templates/vamshop4/components/item/item-cart.html

order_details.html

 

item-cart.html

Link to post
Share on other sites
В 09.07.2019 в 14:39, EdZa сказал:

 

При работе с сотового корзина выходит за пределы экрана.

Будут исправления ?

 

Вот посмотрите демку http://demo.vamshop.ru

Как сейчас выглядит корзина.

По идее, сейчас уж точно нормально на любых устройствах.

Link to post
Share on other sites

А когда основной архив на сайте для скачивания измените? И будет ли там растянутый шаблон?

Link to post
Share on other sites
3 минуты назад, ZM сказал:

А когда основной архив на сайте для скачивания измените? И будет ли там растянутый шаблон?

Обновил.

Link to post
Share on other sites
  • 1 month later...
Роман_DD

У кого-то есть статистика как пользователи на новую корзину реагируют? 

Link to post
Share on other sites
support
1 час назад, Роман_DD сказал:

У кого-то есть статистика как пользователи на новую корзину реагируют? 

Я всех агитирую давным давно настраивать аналитику и цели.

Но мало кто за этим следит, так что я думаю, что статистики особой нет.

Да и сложно сотледить именно этот момент.

т.е. как именно корзина на конверсию повлияла.

Link to post
Share on other sites
Роман_DD
1 минуту назад, support сказал:

Я всех агитирую давным давно настраивать аналитику и цели.

Но мало кто за этим следит, так что я думаю, что статистики особой нет.

Да и сложно сотледить именно этот момент.

т.е. как именно корзина на конверсию повлияла.

Да нет, очень легко там отследить, во первых можно построить воронку продаж в гугл аналитике. Во вторых просто руками посмотреть по конверсии.

Link to post
Share on other sites
support
1 минуту назад, Роман_DD сказал:

Да нет, очень легко там отследить, во первых можно построить воронку продаж в гугл аналитике. Во вторых просто руками посмотреть по конверсии.

Нет, не легко.

и что Вы увидите на своей воронке, как увидите именно влияние внешнего вида корзины?!

Может просто добавили в корзину и ушли, не собираясь оформлять.

или наоборот, добавили и сразу оформили.

Тут сложно оценить именно влияние дизайн корзины.

Например увеличение/уменьшение ctr тоже ведь необязательно связано с плитками в корзине.

 

Кстати, на странице оформления выбор доставки, оплаты тоже сделан чуть симпатичней, плитками.

На demo.vamshop.ru можно посмотреть.

Link to post
Share on other sites
Роман_DD

Ну можно сделать a/b тест просто. Неделю с одной корзиной, неделю с другой. Примерно будет видно. Я чет подзабыл, а полноценная интеграция ecommerce есть для гугла и метрики?

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.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  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...