Skip to main content
Lovable now lets you integrate Cello user referrals entirely through chat. Just ask Lovable to “Add user referrals to your app” and it will do the rest - no manual coding required.

Prerequisites

Before integrating Cello, ensure the following prerequisites are met:
  • The project must be connected to Supabase. Learn more about Supabase
  • User signup and authentication via Supabase is functional
  • Stripe subscription flow is functional
  • You have a Cello account and API keys at hand.
Make sure to use Cello Sandbox environment when developing and testing

Optional: Connect the Cello MCP

The Cello MCP server gives Lovable direct access to Cello’s documentation, integration health checks, and best-practice recommendations. Connecting it before you start means Lovable can look up the right docs itself, verify your setup as it goes, and follow best practices automatically — instead of relying only on the guide link you paste. This step is optional but recommended. The integration steps below work either way.
1

Get your Cello MCP token

Go to the Cello Portal, navigate to Access Keys, and generate an MCP Access Token. Copy the token and save it securely — you won’t be able to view it again.
The Cello MCP server is currently in Early Access. Request access to get it enabled for your account.
Cello Portal MCP Access Token dialog showing the token, a warning to save it securely, and quick-add links for Cursor, VS Code, and Lovable
2

Add the Cello MCP in Lovable

  1. In Lovable, go to Settings → Connectors → Personal connectors
  2. Click New MCP server
  3. Enter the following:
    • Server name: Cello
    • Server URL: https://mcp.cello.so/mcp
    • Authentication: Select Bearer token and paste your API token
  4. Click Add & authorize
The Cello connector now appears in your list of personal connectors.
Lovable Settings showing Cello as an enabled MCP personal connector
You can manage permissions for each tool individually or set a default for all tools at once.
Lovable Cello connector detail view showing all four tools with permission controls
For more details on custom MCP servers in Lovable, see the Lovable MCP documentation. For full details on the Cello MCP and connecting other clients, see the Cello MCP Server page.

Cello user referrals integration

For a step-by-step technical implementation (source of truth + acceptance criteria), follow the detailed guide:
1

Prep your project

  • Signup and authentication flow with Supabase is functional
  • Stripe subscription flow is functional
  • Cello API keys are handy
2

Add Cello Webhook Endpoint to Stripe

  • Get your webhook URL from Cello Portal
  • Add a Webhook endpoint in Stripe (Log into your Stripe Dashboard -> Go to Developer Mode -> Add a Webhook endpoint and enter endpoint URL -> Select the events to send -> Click “Add endpoint”)
  • Secure the Webhook with “Signing secret”
Events to send:
  • charge.refunded, charge.succeeded, charge.updated
  • customer.created, customer.deleted, customer.updated
  • customer.subscription.created, customer.subscription.deleted, customer.subscription.updated
  • invoice.paid
See Stripe Webhook Integration for more details.
3

Prompt Lovable to add User Referrals to your app

Switch Lovable to Plan mode, then paste this prompt:
I want to add user referrals to my app using Cello.

Use the Cello MCP to search the integration documentation, check my current integration status, and create a thorough implementation plan. Follow all best-practice recommendations from Cello.
Lovable will pull the relevant guides, check what’s already set up, and tailor the plan to your project.
Lovable asks you guiding questions and creates an implementation plan based on your answers.
4

Confirm executing the plan

Review the plan carefully. It should cover:
  • Cello JS SDK initialization and user authentication
  • Referral component placement and configuration
  • Attribution setup for tracking referred signups
  • Stripe webhook integration for conversion tracking
If it looks correct, tell Lovable to proceed and start implementing it.
5

Publish & Test

You cannot try the full end-to-end flow in Preview mode. Publish your changes to test.If everything was implemented correctly, you should see events coming in to Cello Dashboard.
If you have the Cello MCP connected, ask Lovable to run a health check after publishing:“Use Cello to check my integration status and confirm all four components are connected.”

After you’re live

If you have the Cello MCP connected, it continues to be useful after the initial integration:
PromptWhat happens
”Is my Cello integration working?”Checks all four integration components and reports which are connected or broken
”Why aren’t referral rewards being triggered?”Inspects recent events to find missing or malformed fields preventing attribution
”How can I improve my referral program?”Returns a prioritized list of recommendations across activation, sharing, and conversion
”How do I set up a custom referral launcher?”Searches the docs for custom launcher implementation guides