Skip to content
Adobe Commerce Storefront
Docs Playgrounds Videos

Checkout overview

The Checkout dropin provides a variety of fully-customizable controls to help complete a purchase. These controls include forms to introduce required information for contact details like email address, delivery and billing addresses, shipping options, and payment methods. Established customers who added items to the cart as a guest have the ability to sign in, automatically loading default addresses and contact details.

Section topics

The topics in this section will help you understand how to customize and use the Checkout dropin effectively within your storefront.

Installation

Provides the step-by-step process for embedding the Checkout dropin into your site. This topic covers everything from basic setup requirements to more advanced configurations, ensuring that the dropin integrates seamlessly with your existing website architecture. It is designed for compatibility with modern web technologies, focusing on ease of use and flexibility for developers. Visit the Checkout Installation page to get started.

Styles

Describes how to customize the appearance of Checkout dropins using CSS. We provide guidelines and examples for applying styles to various components within the dropin. This customization allows brands to align the dropin’s look and feel with their overall design aesthetic, enhancing brand consistency across the platform. Visit the Checkout Styles page to learn more.

Containers

Describes the structural elements of the Checkout dropin, specifically focusing on how the container manages and displays content. It includes information on configuration options and how to leverage these settings to customize the user experience. Understanding the container is essential for developers looking to optimize the layout and styling of their Checkout dropins. Visit the Checkout Containers page to learn more.

Slots

Details the various UI slots available within the Checkout dropin. Each slot can be customized or replaced with alternative content, providing flexibility in how information is presented to the users. This topic includes diagrams and examples that describe the default UI controls and how they can be used to fit different needs. Visit the Checkout Slots page to learn more.

Functions

Describes the API functions available in the Checkout dropin. These functions allow developers to retrieve and display detailed checkout information dynamically. Visit the Checkout Functions page to learn more.