Now on the product page, when the user clicks the button "Add to cart" or "Add to wishlist", without selecting attributes before, the product page reloads and the message "Attention. Please select parameters" appears at the top of the page:
Video: http://recordit.co/FBeACoPeLv
This is inconvenient for several reasons: first, the page reloads, and secondly, both on the computer and on mobile devices, when this message appears, the product page is scrolled back to the top, and the user has to scroll down to attributes and buttons. Many users do not like this, especially for mobile users, as this requires repeated actions and takes time. In addition, some users who make a purchase in an online store for the first time in their lives may not immediately understand which parameters the system asks to choose.
I PROPOSE TO SOLVE THIS PROBLEM IN THIS WAY:
if the user did not select the attribute(s) and clicked the button "Add to cart" or "Add to wishlist", then instead of the message at the top of the page and scrolling the page up, an Ajax message should appear (without reloading the page) "Select the required parameter(s)" directly below the unselected attribute(s). As soon as the user selects all the necessary parameters, this message should immediately disappear (before pressing the button).
If the user continues to click on the button "Add to cart" or "Add to wishlist" without selecting the necessary attributes, then in each case, each time you press the button, the background color of the attribute should flash, as it looks in the example below (see real example) - еhis "unobtrusive" draws the user's attention and does not move the page back to the top.
Video example:
http://recordit.co/FelEFwx5YC
Try real example:
http://coccinelle2-magento2-theme.meigeeteam.com/burgundy/low-curve-iceman-trimix.html
Last change: 09.04.2019 15:42