Documentation

How Delivery Checkout works

Learn how to add a checkout widget to your e-commerce site

Integrating with Ingrid Checkout consists of two parts:

Checkout Session is Ingrid's core concept. It holds information about customer's transaction and contains available delivery options. Whenever something important happens; e.g. customer adds something to the cart, changes the delivery option or your backend decides to change the shipping address on behalf of the customer the session will be updated.

The Shipping Selector is customizable widget, that allow customers to interact with Checkout Session. It will be embedded into your e-commerce checkout page.

It is possible to configure the integration and customize the selector widget in our Merchant Platform.

Session lifecycle

The basic lifecycle of the checkout session is presented below:

  1. When the customer is ready to finalize the purchase, your backend is creating a Checkout Session.
  2. The Session provides HTML snippets that needs to be embedded into the checkout page.
  3. Customer and your backend can interact with the session
  4. When the purchase is done, your backend is completing a Checkout Session.
  5. After the transaction, the order is eventually created.
sequenceDiagram
    actor C as Customer
    participant S as Server
    participant API as Ingrid API
    participant IS as Ingrid Session
    C->>S: Navigates to checkout page
    S->>API: Create Checkout Session
    note right of IS: Session is Active
    API->>S: Return Checkout Session with HTML snippet
    S->>C: Embeds the snippet into checkout page
    loop
        S->>API: Update Session
        C->>IS: Update Session
    end
    C->>S: Complete purchase
    S->>API: Complete Checkout Session
       note right of IS: Session is Completed

What next?

Last updated: Fri, Jul 11, 06:15 AM