When setting up your store, the main goal you have in mind is selling your products. After properly adding other elements to captivate the customer, you must now add the checkout element so they can complete the purchase. Without this, your customers will remain as leads, and no conversions will occur.

How to Add a Checkout Element #

To begin, open your Store Builder and edit the Checkout Page.

If you have not customized the page, the checkout element will be the only element added. Click on it to open its settings.

Configure how the element is displayed by altering its properties. This will include:

General #

• Element name: This will help you identify the element in the Layers view.
• Font Options: Here you can adjust the size and weight of the font, or change the font altogether.
• Sticky Contact: When turned on, this will auto-fill the customer’s information if their data was previously captured by a browser cookie.
• New Contact on Every Purchase: Toggle this feature on or off to choose whether a new contact record should be created for each purchase.
• Validate Disposable Email: When enabled, the system checks if the email address entered belongs to a disposable email provider (e.g., temporary email services often used for spam or temporary purposes) to ensure that only valid emails will be entered into the system.
• Button Actions: Choose whether to redirect the user to another Store page, a URL for further sale opportunities, or to provide additional information.
• Text Options: This feature enables you to modify the text displayed in the various sections of the element.

Form Options: Customize this section to collect only relevant and necessary information, enabling faster checkout.

• Full Name Validation: Enable this option to verify the full name provided by each user in the relevant field.
• Enable Billing Address: Activate this feature to collect billing address information from your contacts. Note that the billing address section is not connected to tax calculations.
• Toggle Shipping: Select whether to display or hide the shipping fields based on your preferences.
• Auto-complete Address: When enabled, this feature will provide address suggestions as clients enter partial address information, reducing input time and enhancing the customer experience.
• Enable Notes at Checkout: Activate this feature to allow your contacts to add additional information or special requests during checkout for your review.

Note: Shipping details fields can only be customized if Shipping has been toggled on.

The following fields can be marked as Hidden, Optional, or Mandatory: Phone Number, Address, Country / State, City, and Zip / Postal Code. By default, fields in this section will be set to Mandatory.

Note: Shipping rates may be affected if certain fields are missing in the Shipping Details section. For live rates from multi-carrier platforms like Shippo, all fields need to be submitted by the user.

Furthermore, you can restrict the products to certain locations and choose how to collect customer locations.

• Coupon Options: Offer discounts to your customers using promotional codes by toggling the “Enable Coupon Codes” switch.
• Terms & Conditions: The checkbox is mandatory when enabled, meaning that the checkout cannot proceed without acceptance.
• Color Options: Customize the colors of the Checkout element. Everything from the background to the text and payment button colors can be changed here.

Styles #

• Margin & Padding: Choose how the element fits on the page by adjusting the margin and padding settings.
• Borders: This allows you to change the appearance of the borders and corners of the element to suit your needs.
• Shadow: Add dimension and movement to the element by adding box shadows.
• Visibility: Choose whether you want the order form to be visible on mobile devices, desktops, or both by clicking the icon to highlight your preference.

Once you have completed customizing the element, click Save to keep the changes or Publish to make them public. You can now effortlessly drive sales for your store by utilizing this element, enhancing your ability to convert leads into lifetime customers.

Frequently Asked Questions #

Why do I need a Checkout element? #

Without a checkout element, customers cannot complete a purchase, so they remain leads and no conversions occur. It is the element that lets shoppers actually pay for their order.

Where do I add the Checkout element? #

Open your Store Builder and edit the Checkout Page. If the page hasn’t been customized, the checkout element is the only element present; click it to open its settings.

What is Sticky Contact? #

When Sticky Contact is turned on, the checkout auto-fills the customer’s information if their data was previously captured by a browser cookie, speeding up the process.

Can I control which checkout fields are required? #

Yes. Fields such as Phone Number, Address, Country/State, City, and Zip/Postal Code can be set to Hidden, Optional, or Mandatory. By default these fields are Mandatory.

Does the billing address affect tax calculations? #

No. You can enable the billing address to collect that information from contacts, but the billing address section is not connected to tax calculations.

Why are my shipping rates not showing correctly? #

Shipping rates may be affected if certain fields are missing in the Shipping Details section. For live rates from multi-carrier platforms like Shippo, all fields must be submitted by the user.