You can accept payments directly within projects built in AI Studio. It uses your existing ZipLeads products and payment setup. You can add payments while AI Studio is building the project, or set them up later from within the builder. This article explains how to enable payments, add products, set up pricing, manage checkout and review orders.
Payments in AI Studio lets you add working checkout experiences to AI-generated projects. You might be selling a single product, offering subscriptions or building an online storefront. Either way, you can use the products and prices already set up in your ZipLeads account.
AI Studio handles how products and checkout appear in your project. ZipLeads handles payment processing and order records. This means you can customise the shopping experience without rebuilding your existing payment setup.
It's a faster way to go from an idea to a working purchase experience. Your products, payment setup and orders all stay in one place in ZipLeads.
Important: Shipping and pickup are not supported in the current release. Payments are also not supported for AI Studio calendar experiences.
Current Limitations
Manual Payments: Manual payment methods, including Cash on Delivery, are unavailable.
Calendar Payments: Payments are not supported for AI Studio calendar experiences.
Product Personalisation: Free-form personalisation fields, such as engraving text or custom printing instructions, can't be passed to orders.
Product Editing: Product details, prices and variations must be managed in the ZipLeads product catalogue.
Project Type: Payments are currently only available for projects built on TanStack Start. Existing React projects must be migrated using Project Settings > Migrate to SSR before the Payments option becomes available.
Shipping and Pickup: Customer-facing shipping and pickup options are not supported.
How to Enable Payments in AI Studio
You can enable payments while AI Studio is building your project, or directly from the project's Payments settings.
Automatic Payment Detection
If AI Studio sees that your request involves selling a product or taking payments, it can prompt you to enable payments while the project is being generated.
Describe the website or experience you want AI Studio to build.
If AI Studio detects selling intent, an Add payments to this app prompt appears.
Click Enable Payments to include payments in the project.
Answer any follow-up questions AI Studio asks about the experience you want to create.
The follow-up questions are based on your original request, so they can vary from project to project. For example, AI Studio may ask how you want customers to buy the product, or what type of selling experience you want.
Enabling payments during the build lets AI Studio plan for checkout and purchasing as it creates the project. Once the project is generated, go to More > Payments to review and finish the payment setup.
Manually Enable Payments
You can also enable or manage payments directly from the project, without waiting for AI Studio to detect selling intent.
From within your AI Studio project, click More.
Select Payments.
Click Enable Payments.
The Payments area shows the project's payment status, Test and Live modes, payment method and payment products. You can also turn off payments for a project from this page.
Configure Your Payment Provider
AI Studio uses your existing ZipLeads payment setup. Payment providers are managed in your ZipLeads payment settings, not through a separate AI Studio integration.
In the Payment method area:
Click Connect if no payment provider is connected.
Click Manage to review or update the existing payment integration.
If a provider is already connected in ZipLeads, AI Studio uses that payment setup for the project.
When payments are enabled, the project starts in Test mode by default. Use Test mode to check the product, pricing and checkout experience without processing real charges. When you've finished testing, switch to Live mode to start accepting real customer payments.
How to Add and Configure Products
AI Studio uses products from your existing ZipLeads product catalogue. The product, its pricing and any variations must already be set up in ZipLeads before you can add it to an AI Studio project.
To add a product:
Open More > Payments.
In Payment products, click Add products or Browse catalog.
Search for a product by name or SKU.
Select the product or products you want to add, then click Continue to pricing.
Choose how the product should be offered:
Fixed price: Select the specific price or variation customers will buy.
Customer chooses variation: Let customers choose from the variations already set up for that product.
Review the setup, then click Add product.
Note: AI Studio Payments supports both recurring products (subscriptions) and post-purchase upsells.
Checkout Experience
Checkout in an AI Studio project is hosted and managed by ZipLeads. Card details are entered and processed through the ZipLeads hosted checkout. They are never handled by your app's generated code.
Supported payment methods include:
Card payments through the connected payment provider
PayPal Express Checkout
Checkout also supports fully discounted orders without needing card details. It supports subscriptions too, including carts with more than one subscription product.
After checkout, you can show a post-purchase upsell. With supported saved-card providers (Stripe, Square, Authorize.net, NMI, Adyen and Mercado Pago), customers can accept the offer in one click without entering their payment details again. Other payment methods use the standard payment form.
An upsell can only be charged after the original order has been paid successfully, and only once per order.
Orders and Post-Purchase Experience
Orders from AI Studio appear in Orders in ZipLeads, just like orders from other sales channels. Open an order to see the customer, purchased products, payment status, transaction details and fulfilment information.
The Source section shows which orders came from AI Studio, along with the related project details, including the project name, project ID and domain.
You can also use ZipLeads workflows after a purchase to send confirmations, follow-up messages, internal notifications or other post-purchase automations.
