Cart Checkout - Mobile View suggestion

Phoca Cart - complex e-commerce extension
User avatar
dmlwebal
Phoca Professional
Phoca Professional
Posts: 106
Joined: 18 Sep 2019, 12:49

Cart Checkout - Mobile View suggestion

Post by dmlwebal » 16 Oct 2020, 12:43

Some mobile handsets have a problem showing/scrolling to the bottom of the Cart Dropdown. The problem is that the Check out button is at the base of this dropdown. As customers add more products to the cart the problem becomes more clear.

Might I suggest placing the link options at the top of the Cart Dropdown?

You may not pick this issue up just by using the Chrome Mobile Views (Toggle Device Toolbar) but I have a Nokia Android handset that definitely has this problem.
Obviously I can add a Checkout link to the Mobile view/Off Canvas Menu but it looks more professional to have this option visible in the designated area also.

Tags:

User avatar
Jan
Phoca Hero
Phoca Hero
Posts: 42990
Joined: 10 Nov 2007, 18:23
Location: Czech Republic
Contact:

Re: Cart Checkout - Mobile View suggestion

Post by Jan » 17 Oct 2020, 16:13

Hi, can you paste a screenshot of what do you exactly mean?

Jan
If you find Phoca extensions useful, please support the project

User avatar
dmlwebal
Phoca Professional
Phoca Professional
Posts: 106
Joined: 18 Sep 2019, 12:49

Re: Cart Checkout - Mobile View suggestion

Post by dmlwebal » 18 Oct 2020, 16:00

Hi Jan

Sure, on a larger Samsung or I-phone then the cart checkout link is still visible - even with 3 items

here is an example of open and closed - I use a sticky navbar on mobile to maximise screen space
https://ibb.co/wWP4WkY

But smaller screens lose out on the checkout link
https://ibb.co/XVtkW0G

Also, there is no obvious way to close the drop down when the viewport is full, and scrolling will only affect the background page

So, by moving the checkout link to the top of the checkout dropdown there is always access.

Of course many people have larger phones but with the cart link at the base of the dropdown there will always be a 'cut-off' point where the link becomes inaccessible.

I can see where to make the change in the code but thought it worth mentioning. It does not seem to take a lot to negatively affect online sales conversions for users.

Regards
David

User avatar
Jan
Phoca Hero
Phoca Hero
Posts: 42990
Joined: 10 Nov 2007, 18:23
Location: Czech Republic
Contact:

Re: Cart Checkout - Mobile View suggestion

Post by Jan » 20 Oct 2020, 15:22

Hi, thank you for the info, I will take a look at it, maybe there should be some CSS rule for small devices to move the link to top (absolute) or changing the link to icon on the top, so it will not take a lot of place there :idea:

Jan
If you find Phoca extensions useful, please support the project

User avatar
dmlwebal
Phoca Professional
Phoca Professional
Posts: 106
Joined: 18 Sep 2019, 12:49

Re: Cart Checkout - Mobile View suggestion

Post by dmlwebal » 20 Oct 2020, 17:51

Hi Jan

No problem. The most simple solution may be just to add a second checkout link to the right of the Items count? I have done this before on another project and the use of bootstrap in the construction of the dropdown means that this is quite simple. It does not need to be an esoteric solution.
I have some catching up to do on some current projects ( I contracted Covid-19 and was out of action for a few weeks) but I shall make some instructions for the Ajax Live Search plugin and also see if I can create a cart module dropdown with Flex and Grid.

Regards
David

User avatar
Jan
Phoca Hero
Phoca Hero
Posts: 42990
Joined: 10 Nov 2007, 18:23
Location: Czech Republic
Contact:

Re: Cart Checkout - Mobile View suggestion

Post by Jan » 20 Oct 2020, 21:30

Ok
If you find Phoca extensions useful, please support the project

Post Reply