The Checkout Details widget grouping includes a set of widgets designed to organize essential information during checkout. You can design the widgets inside the grouping to make the checkout more user-friendly.
In order to access the Checkout Details widget grouping, open Pages > Ecommerce > Checkout Details template and open the required widgets list.
Adding Checkout Details Widgets
To add Checkout Details Widgets:
- Go to the Visual Editor from Channels on the Dashboard Left Panel.
- Open Pages > Ecommerce > Checkout Details page.
- Type the widget name in the search bar, or open the Ecommerce > Checkout Details Widgets grouping.
- Drag and drop the requested widget from the list on the Layout Canvas.
Configuring the Checkout Details Widgets
You can configure and edit all the widgets under this grouping using the widget Styles and Settings on the Property Panel.
- Go to Styles to modify the necessary configuration of general styling features (see Global Styles). Global Styles are a set of predefined style settings that can be applied to widgets across the website. They provide a constant appearance by defining default styles for all the widget types.
- Go to Settings to modify the Visibility of the widget on your website. Specifically, select who can view the widget according to the customer location, session status, used device type, browser, language preference, etc. (see Visibility Settings).
Contact Details
The Contact Details widget displays the information related to the customer's contact information. It includes fields such as the customer name, email address, or phone number.
The purpose of this widget is to gather the necessary information to establish communication with the customer regarding the order, updates, and any other notifications if they opt for such communication.
If a customer chooses guest checkout and later registers, they can easily access and monitor all their orders, whether placed as a registered user or through guest checkout, using the same email or phone details. The system combines orders with the same email or phone number for a streamlined customer experience.
Once you have added the Contact Details widget, you can modify its Styles (see Global Styles) and Settings (see Visibility Settings).
You can also access the UI Elements available in the Design System from the upper-right corner of the Property Panel and select one as a base for the widget or create a new UI Element and style it according to your preferences.
Shipping Details
The Shipping Details widget displays the necessary information for delivering the order to the customer's desired shipping address. It includes fields such as the customer name, shipping address, country, state/region, city postal code, etc.
The widget allows you to verify the accuracy of the shipping address to prevent shipping errors or delays, allowing your customer to provide special instructions or preferences related to the delivery.
Customers enter their ZIP code in the Shipping Details widget, which is then used by the system to determine if the shipping method is available for the customer's country or not.
You set up shipping relevant information from Dashboard > Settings > Shipping & Delivery. Based on a Shipping Profile, the available list of countries is shown to the customer.
Once you have added the Shipping Details widget, you can modify its Styles (see Global Styles) and Settings (see Visibility Settings).
You can also access the UI Elements available in the Design System from the upper-right corner of the Property Panel and select one as a base for the widget or create a new UI Element and style it according to your preferences.
Terms of Service
The Terms of Service widget provides the terms and conditions or legal agreements the customer must accept or acknowledge before completing the checkout process. It includes a checkbox the customer must click to indicate their acceptance of the terms. The purpose of this widget is to inform the customer about the rules, policies, and legal obligations associated with the purchase, which can help protect the business in case of disputes or legal issues.
Your customers are redirected to the Terms and Conditions page via the link in the public mode.
The Terms and Conditions information is generated from Dashboard > Settings > Legal Docs, where you set up all the relevant details.
Once you have added the Terms of Service widget, you can modify its Styles (see Global Styles) and Settings (see Visibility Settings) on the Property Panel.
💡 If you have questions or concerns, contact us directly via the Live Chat box in the lower right corner. Our Support Team will provide you with top-notch quality support 24/7.