Custom Checkout on VTEX Platform? It's possible. Get to know the new project at Souq
The history of Souq and Codeby has been built just over a year ago, and today we are pleased to deliver the new Checkout from the store.
For those who do not know Checkout is the name given to the closing of the purchase process, in an e-commerce is the page where the customer ends the purchase, confirming all the information and adding the form of payment and delivery address.
Our team made a fully customized checkout inside the VTEX platform and through the layout created by the brand designers Anna Amex, were modified within the / cart positions of some items like freight calculation, coupon addition, subtotal, total and button to finalize.
All of these buttons went to the right side to improve customer accessibility). Also, for everything to work perfectly this way, we added a few JS lines that made the difference.
We have also introduced our Seller Plugin, allowing you to enter the seller code to be linked to the purchase. In the second stage of Checkout, we only added a CSS because the functionality is native to VTEX and we also perform validation of the email.
Now / Profile / shipping / payment are on the same page as we modified visual CSS and included field validations to work as planned. In this project, the biggest challenge was the validations, because as VTEX already has validation, our team needed to insert again to meet the intended flow initially.
See the before and the after:
So, did you like to know more about this project? What do you think about the result? Come and tell us the comments.