LWC - Order Checkout
Order Checkout
The Order Checkout Lightning Web Component (LWC) displays the order details for the member during the checkout process. In addition to displaying the details of the order, the member/constituent will also be able to specify shipping address, select shipping options as needed along with the mode of payment as they are checking out the products.
Configuration Options
From the components list, select the Order Checkout component and drag it onto the site page.
On the page, click within the Order Checkout component to bring up the Property editor.
Figure 1. Order Checkout LWC with configuration properties
| Properties | Description |
|---|---|
| Order | This setting needs to be configured to display the details of the order for checkout. Use {recordId} for the current record, {url.<param>} (e.g. {url.id}) for a URL parameter, or a Salesforce record ID. |
| Order Summary Page | This setting needs to be configured for the API name of the Experience Builder page to use for the Payment Confirmation. |
| Shopping Cart page | This allows you to enter the API name of the Shopping Cart page. |
Example
Figure 2. Order Checkout page in Experience Cloud Community Hub with the Back to Shopping Cart option (when 'Add to Cart' is used)
Figure 3. Order Checkout page in Experience Cloud Community Hub without the Back to Shopping Cart option (when 'Buy Now' is used)