Checkout flow

The Store and the Ecommerce Galleries both have a single checkout.

All the products selected from store and eCommerce galleries will be combined into one order and placed as a single order.

The checkout flow would be as shown below:

  1. Store/eCommerce gallery or the product page
  2. Cart
  3. Shopping Cart Page
  4. Customer Information page
  5. Checkout/Shipping & Payment Method page
  6. Order success page

  1. On this page, the visitors will view the products/items, and click on Add to Cart (1) button of the respective product. For styling the Add to Cart button, check Styling Buttons & Links.
  2. Then a small message pop-up (2) appears at the bottom informing that the product has been added to the cart.
  3. Once a product is added to the cart, the number over the cart icon (3) increments and vice versa. For styling the floating cart icon, check Cart icon style.


Cart

  • From the cart drawer, you can increase or decrease the quantity (1) of an item.
  • You can remove a particular item from cart by clicking on the delete (2) icon.
  • The cost (2) of the item would be displayed here.
  • Click on the X (4) icon to exit the cart and continue shopping.
  • The subtotal (5) i.e., the total cost of the items in the cart will be shown here.
  • Click on the View Cart (6) button to see the Shopping Cart page. Know more.
  • To proceed with the checkout, click on Checkout (7) button.


Shopping Cart Page

  • From here also, you can change the Quantity (1) of items in cart.
  • Delete (2) an item from the cart.
  • View the Price (3) of a single item or the price per unit.
  • View the cumulative Amount (4) of different items in the cart.
  • Proceed to the Checkout (5) page.
  • Return to the store and Continue Shopping (6).


Customer Information page

  1. The System Logo will appear here. But when it is not available the Site Title appears here.
  2. You can edit the cart from here.
  3. Log in to your store account. Learn more.
  4. Enter the email address here.
  5. Enter the Contact Information like first name, last name, phone number along with the country code, company name, address lines 1 & 2, city, country, state, and the postal code here.
  6. All the items added to the cart will be visible here.
  7. The discount box appears here. The discount code can be applied here.
    Also Check: Hide discount coupon box
  8. The sub-total and the total amount due will be displayed here.
  9. After filling in all the information, click on Continue to visit the Shipping & Payment method page and place the order.

 


Checkout/Shipping & Payment Method page

  1. The customer details and shipping address entered in the customer information page will be visible here.
  2. Click on edit to edit the customer information entered on the previous page.
  3. Notes to the seller (like special instructions) can be written here.
  4. Edit the cart by clicking on it.
  5. The order summary like the items in the cart, sub-total, shipping cost, tax, and the total amount to be paid will be displayed here.
  6. All the payment methods accepted will be displayed here. Select any one of the payment methods and make the payment.
    Also Check: Supported payment gateways
  7. Check in this option so that the shipping address specified earlier is taken as the billing address or you can simply de-select it to specify a new billing address.
  8. Check in this option to accept the terms of use.
  9. Click on the I accept the terms of use label to view the terms of use.
  10. Click on the Complete Order button in order to place the order.


Order Success Page

Once a visitor has placed an order on your website successfully, the order success page will be visible.

Learn more about the order success page.


Can't find what you're looking for?

Get in touch with a Pixpa Expert.