> ## Documentation Index
> Fetch the complete documentation index at: https://docs.partnero.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Connect Lovable

> Add Partnero referral tracking to an app you built with Lovable, and connect Partnero to the Lovable chat as a custom MCP connector.

Partnero isn't in Lovable's connector catalog, so there are two ways in. They do different things, and the
difference matters:

| Path | What it gives you |
| - | - |
| **API integration** | Referral tracking inside the app you publish. Lovable writes the code. |
| **Custom MCP connector** | Lovable can read your Partnero program while it builds. Never part of the published app. |

If you want your app to track referrals, you want the first one.

## Add referral tracking to your app

Lovable can integrate any API by writing the code itself — you describe the service and it handles the rest,
storing credentials as secrets in the built-in backend.

<Steps>
  <Step title="Get your program ID and API key">
    In [Partnero](https://app.partnero.com), go to **Integration**. Copy your program ID from the tracking snippet
    and generate an API key under **API**.

    <Warning>
      Keep your API key server-side. The steps below store it as a Cloud secret so it never reaches the browser.
    </Warning>
  </Step>

  <Step title="Enable Cloud and store the key">
    In your Lovable project, enable **Cloud**, then add your API key under **Cloud** → **Secrets** as
    `PARTNERO_API_KEY`. Lovable reads it from Edge Functions, which keeps it out of your client bundle.
  </Step>

  <Step title="Paste the prompt">
    Copy the prompt below into the Lovable chat, replacing `YOUR_PROGRAM_ID`. Add a sentence about where your
    sign-up and payment code lives if Lovable doesn't find it on its own.

    <Accordion title="Prompt: Add Partnero referral tracking">
      ```text theme={"system"}
      Integrate Partnero affiliate and referral tracking into this app.

      Partnero is an affiliate and referral management platform.
      - API base URL: https://api.partnero.com/v1/
      - Authentication: Bearer token in the Authorization header
      - The API key is already stored as the Cloud secret PARTNERO_API_KEY
      - OpenAPI spec: https://docs.partnero.com/api-reference/openapi.json
      - Program ID: YOUR_PROGRAM_ID

      What needs to happen:

      1. FRONTEND — add this snippet to the <head> of index.html so it loads on
      every page:

      <script>
          (function(p,t,n,e,r,o){ p['__partnerObject']=r;function f(){
          var c={ a:arguments,q:[]};var r=this.push(c);return "number"!=typeof r?r:f.bind(c.q);}
          f.q=f.q||[];p[r]=p[r]||f.bind(f.q);p[r].q=p[r].q||f.q;o=t.createElement(n);
          var _=t.getElementsByTagName(n)[0];o.async=1;o.src=e+'?v'+(~~(new Date().getTime()/1e6));
          _.parentNode.insertBefore(o,_);})(window, document, 'script', 'https://app.partnero.com/js/universal.js', 'po');
          po('settings', 'assets_host', 'https://assets.partnero.com');
          po('program', 'YOUR_PROGRAM_ID', 'load');
      </script>

      This reads the partner key from referral URLs such as ?ref=PARTNER_KEY and
      stores it in a first-party cookie called "partnero_partner".

      2. BACKEND — create an Edge Function that runs when someone signs up. Read
      the "partnero_partner" cookie from the request and call:

      POST https://api.partnero.com/v1/customers
      Headers: Authorization: Bearer PARTNERO_API_KEY, Content-Type: application/json
      Body:
      {
        "partner": { "key": "VALUE_FROM_COOKIE" },
        "key": "unique_customer_id",
        "email": "customer@example.com",
        "name": "Customer Name"
      }

      3. BACKEND — create an Edge Function that runs after a successful payment:

      POST https://api.partnero.com/v1/transactions
      Headers: Authorization: Bearer PARTNERO_API_KEY, Content-Type: application/json
      Body:
      {
        "customer": { "key": "unique_customer_id" },
        "key": "unique_transaction_id",
        "amount": 99.99,
        "action": "sale"
      }

      Important rules:
      - Create a customer only when the "partnero_partner" cookie is present. In
        an affiliate program the API rejects a customer with no partner attached.
      - Send transactions for every purchase. Ones for customers that were never
        referred are rejected, which is expected and harmless.
      - Make the calls non-blocking. If Partnero is unreachable, the sign-up or
        payment must still succeed. Wrap them in try/catch and log failures.
      - Use the same customer "key" in both calls. That is how Partnero links a
        purchase back to the partner who referred the customer.
      - Use your order or invoice ID as the transaction "key" so refunds can be
        matched later.
      ```
    </Accordion>
  </Step>

  <Step title="Test a referral">
    Publish the app, then open it with a referral link — `https://yourapp.com/?ref=PARTNER_KEY` — and complete a
    sign-up. The customer should appear in Partnero against that partner.
  </Step>
</Steps>

<Note>
  The [AI prompts guide](/guides/ai-integration) has prompts for other scenarios, including refer-a-friend programs,
  lead submission and coupon tracking. They work in the Lovable chat the same way.
</Note>

## Connect Partnero to the Lovable chat

You can also give Lovable itself access to your program through Partnero's [MCP server](/guides/mcp-server), so it
can look up real partners and settings while it builds.

<Warning>
  Chat connectors only give Lovable context while you are building. They are never part of the app you publish, so
  this does not add referral tracking to your app — use the API integration above for that.
</Warning>

<Steps>
  <Step title="Copy the MCP URL">
    In [Partnero](https://app.partnero.com), go to **Integration** → **MCP**, switch Authentication to **OAuth**
    and copy the server URL:

    ```
    https://api.partnero.com/mcp
    ```
  </Step>

  <Step title="Add it as a custom MCP server">
    In Lovable, open **Connectors**, scroll to the bottom of the **All** view and select the **Custom** card
    labelled MCP. Paste the URL and select **Add & authorize**.
  </Step>

  <Step title="Sign in and choose a program">
    Lovable opens Partnero in your browser. Log in, choose the program it should read, and approve the request.

    <Note>
      Chat connections are personal to you. The connection uses your own Partnero account and isn't shared with
      anyone else in the workspace.
    </Note>
  </Step>
</Steps>

Once connected, you can ask Lovable things like "what commission rate does my program pay?" or "list my top
partners" while you build, and it will read the answer from Partnero instead of guessing.

## Next steps

<CardGroup cols={2}>
  <Card title="MCP Server" icon="plug" href="/guides/mcp-server">
    Everything an assistant can do with your program, and the other tools you can connect
  </Card>

  <Card title="AI prompts" icon="robot" href="/guides/ai-integration">
    Copy-paste prompts for other integration scenarios
  </Card>
</CardGroup>


This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.