First Checkout

Walk-through

1. Add a product to cart

Add any WooCommerce product to your cart. Swft only activates when the cart has at least one item.

2. Pre-created session

As soon as you add an item, WooCommerce fires woocommerce_cart_updated. The Swft plugin hooks into this, builds the cart payload, and calls api.swft.co.uk/sessions to pre-create a session. The session URL is cached in a WordPress transient keyed by the cart hash (swft_session_{cart_hash}).

This happens in the background — the customer never waits for it.

3. Click “Proceed to checkout”

The customer navigates to the WooCommerce checkout page. The plugin intercepts via template_redirect (priority 1):

1. Checks swft_enabled option is yes
2. Checks API key is set
3. Checks cart is not empty
4. Looks up the transient — finds the pre-created session URL
5. Calls wp_safe_redirect() to checkout.swft.co.uk/{sessionId}

The redirect is instant because the session already exists.

4. Checkout loads

The Cloudflare Worker at checkout.swft.co.uk reads the session from Cloudflare KV and injects it as window.__SWFT_SESSION__ into the HTML response. The React app boots and reads the session — no loading state in most cases.

5. Details step

The customer sees:

• Apple Pay / Google Pay buttons (if available in their browser)
• Email address field
• Shipping address fields (first name, last name, address line 1 and 2, city, postcode, country)
• Shipping method selection (radio cards with prices from WooCommerce)

If the customer has ordered before and WooCommerce REST API credentials are set, their address is pre-filled via a customer lookup call.

6. Payment step

After clicking Continue to payment, the frontend calls POST api.swft.co.uk/sessions/{id}/pay with the selected shipping method and customer details. The API creates a Stripe PaymentIntent and returns the clientSecret.

Stripe Elements renders the card input. The pay button shows the exact total: Pay £[amount].

The customer enters card details and clicks Pay.

7. Confirmation

Stripe confirms the payment. The checkout shows a confirmation screen with:

• Order reference number (WooCommerce order number)
• Delivery address
• Estimated delivery window (if available)
• Interactive map (if Google Maps API key is set)

Simultaneously, in the background:

• Stripe fires payment_intent.succeeded to the Swft webhook
• The API creates a WooCommerce order via REST API (status: processing)
• A confirmation email is sent to the customer
• Server-side tracking events fire (Purchase) to Meta CAPI, GA4, and TikTok

8. WooCommerce order

Check WooCommerce → Orders. A new order appears with:

• Status: Processing
• Payment method: Card (Swft)
• All line items, shipping line, and billing/shipping address
• Custom meta: _swft_session_id, _swft_payment_intent
• Extension data as _swft_ext_{key} meta fields

Troubleshooting

Swft is not intercepting checkout:

Enable debug logging in Settings → Swft Checkout → Debug Logging, then visit the checkout page. The debug log shows every decision point. Common causes:

• swft_enabled is not yes — check the Enable checkbox is saved
• API key is empty
• Cart is empty at time of redirect

Session creation failed:

The plugin falls through to native WooCommerce checkout if no session URL is returned. Check:

• API key is valid
• api.swft.co.uk is reachable from your server
• No firewall blocking outbound requests to api.swft.co.uk

Orders not appearing in WooCommerce:

The WooCommerce REST API credentials may be missing or incorrect. Verify them in Settings → Swft Checkout → WooCommerce API Credentials. The status field shows whether the credentials have been synced.