Checkout Page
The checkout page is where you enter the necessary personal and payment information in order to complete the order.
If the customer would prefer to use Paypal, they can click on this button to be redirected to Paypal.
Customers who have already purchased from your store or registered an account can choose to login here, so that their personal information is autofilled once doing so.
This entire section is devoted to the customer's billing information. The fields with "required" next to them are mandatory in order to complete the checkout process. If a mandatory field is empty, the customer will be prompted with an error message to fill in the field. All fields that are part of this section go directly into the newly-created customer card once the checkout process is complete, and will be auto-populated in the checkout if the user logs in to purchase from items from the store. This information can also be edited by the user in their account section.
At the top of this area, the user can choose to use their billing details for shipping, negating the need to fill the same info twice. They can also choose to fill out a different address (with the exact same fields in the "billing details" section being presented), or send each item in their cart to a unique address if required, by clicking the "multiple addresses" radio button.
The "shipping options for [postcode]" section displays the shipping options available depending on the methods set up in your shipping matrix, each one being accompanied by a clickable radio button to make your choice. Once a selection is made, the "total shipping" and "order total" fields will refresh in the order summary section.
The "delivery instructions" box offers a place to enter text for the delivery driver, for example "walk to rear of house and knock". The "save for future orders" box saves your delivery instructions to your account for the next time you order.
If the customer is happy for the parcel to be left outside of the delivery address, the "Authority to leave parcel" checkbox can be set to "yes".
A business who uses dropshipping methods will find the "send invoice with goods" option handy, as it'll leave a note on the order requesting that the invoice is sent with the order through the post.
The "buying this for work?" field allows you to enter a PO number for the customer's own accounting purposes.
This area is where the customer chooses their preferred payment methods by either clicking on the image, or choosing from the dropdown menu. Here's a brief overview of the payment options in question:
This redirects to Paypal; once logged in and their preferred billing and payment info is confirmed, the user is directed back to the checkout page, with the billing and shipping details auto-populated (or overwritten) based on their Paypal account information. The purchase can then be completed.
Choosing and completing the checkout process using any of these payment methods will result in the necessary information being presented to the user on the payment confirmation page, so that they can pay the full amount for the order.
Opting to pay with a debit/credit card will result in the standard fields (such as card number, security code, etc.) being presented to the customer in order to complete the purchase.
If the user has a gift voucher that they'd like to use, they can click on this section to enter their personal code to redeem.
All purchases can only be completed once the user has ticked on the "agree to terms" checkbox.
The final stage of the checkout process, which (providing all mandatory information is correctly completed) confirms the order and sends an invoice to the customer.