Applicable Versions: 1.6 and above.
What Is One Page Checkout (OPC)?
One Page Checkout (commonly known as OPC) feature makes the checkout process simple, visually appealing and intuitive. In case the shopper has more than one delivery addresses, then it allows the shopper to select the most appropriate delivery address for the particular order.
Order Summary tab allows the shopper to apply a coupon to the transaction. The effect of the coupon is displayed immediately in the same tab.
Shipping options tab lets the shopper select the most appropriate shipping option, which includes ‘Pick up at the store’. This option also allows the shopper to check the stock availability of the item(s) at the selected store.
Payment Option tab allows the shopper to select the payment mode, which can either be Credit Card, Cash On Delivery (COD) etc.
It is possible to have Shipping Option as ‘Pick up at the store’ and payment option as COD. This combination will allow the shopper to collect and pay for the goods at the store.
How to Configure One Page Checkout (OPC)?
Login to Admin Console and navigate to Configuration → Appconfig Parameters, search for the configuration checkout.type. Set the value of this configuration as SmartOPC.
Note: Reset the cache for the change to take effect.
How OPC will appear in the shopper’s console?
The OPC will consists of following 5 steps
Step 1: LOGIN ID
Shopper needs to key in his/her login credentials (if returning customer), or can register (First time visitor) to proceed with checkout.
Note: If shopper is already logged in, then this step would get skipped. However, shopper can go back to this step and change his login credentials (if required).
Please refer to the screen shot below.
Note: In the above screen shot, the first tab (i.e. LOGIN ID) is collapsed as the shopper is already logged in. However, shopper may opt to login with a different credential, so using the button “Change Login” in the first tab (i.e. LOGIN ID) it can be done.
Step 2: Delivery Address
Shopper hovers the mouse to his/her different shipping addresses available as shown and choose one of them. Shopper will be redirected to next tab (Order Summary). Further shopper may wish to add a completely new address by clicking the option “Ship to Another Address”.
Step 3: Order Summary
After Click on Continue Checkout or Ship Here button (In the 2nd tab), shopper is redirected to Order Summary tab.
In this tab shopper can increase/decrease the quantity of the product(s). Shopper can also remove products(s) if he/she wishes to.
If order option is configured, then shopper can add or delete order option as per his/her requirement. Coupon can also be applied in this tab.
Further shopper clicks on the Proceed to checkout button to proceed to the next tab (i.e. Shipping Options)
Step 4: Shipping Options
Note: This tab will not appear if only one shipping method is defined and in store pickup is NOT enabled. In such a scenario, shopper will be directed the next tab (i.e. Payment Options)
On selecting a shipping method, shopper will be directed to the next and final tab (i.e. Payment Options).
Step 4: Payment Options
In this tab shopper can choose from different payment options he/she wishes to pay, such as Credit Card, COD etc. Order Notes and Terms and Conditions section will only be visible provided order Notes and Terms and Conditions appconfig is configured properly.
Payment methods and Discount sections such as Coupon Code, Promotional Code, Gift Card Code and Loyalty also appears in this tab.
Finally, shopper clicks on Place Order Button to place the order. Once order is placed successfully, shopper gets directed to order confirmation page, see the screen shot below.
How it will appear in the shopper’s console if user is not logged in?
If user is not logged in and product(s) are added to shopping cart followed by proceed to check out, then default Sign In tab will appear. In this tab shopper can log in with his existing user id and password or if he/she forgot his/her password then can recover his/her password by clicking on Have you forget your password link. If user does not have an existing account, then he/she can register by clicking on Register Now link and can complete his/her checkout process. Shopper can also checkout without registering himself/herself provided anonymous shopping configuration is enabled. Shopper can also login using social media such as Facebook, twitter, LinkedIn etc. (if configured).
iVend eCommerce – Skin 107 Variant 2– Configuring Entity Page October 2, 2016
iVend eCommerce – Skin 107 Variant 2– Configuring Home Page August 31, 2016
iVend eCommerce - How to manage gift cards August 30, 2016
iVend eCommerce - Automatic locale selection August 30, 2016
iVend eCommerce - What are locations and how to manage them August 30, 2016
iVend eCommerce - How to configure partial refund August 30, 2016
iVend eCommerce - How to configure partial payments August 30, 2016
iVend eCommerce - How to configure partial delivery August 30, 2016
iVend eCommerce - How to configure partial refund 323469 Views
iVend eCommerce - How to configure partial payments 302463 Views
iVend eCommerce - Automatic locale selection 294043 Views
iVend eCommerce - How to configure partial delivery 281221 Views