Skip to content
Contact us
  • There are no suggestions because the search field is empty.

How to Integrate Prerender with your Lovable Site (Lovable Free Plan)

This guide helps you enable Prerender for a Lovable-hosted website while keeping your site on Lovable. It is designed for non-technical users and avoids common Cloudflare errors by using Cloudflare Workers Custom Domains as the "front door".

What to Expect

This integration takes about 45 minutes. Prerender connects to your Lovable site through Cloudflare. Cloudflare sits in front of your domain and routes requests either to Prerender or to your Lovable app, depending on who is visiting the page.

For both Lovable setups, bots are routed to Prerender and receive pre-rendered HTML.

For free Lovable users, Cloudflare also proxies normal visitor traffic to your Lovable-hosted app. The current worker-custom-domain.js code injects the correct canonical URL and rewrites only redirects that point back to your Lovable upstream, which helps prevent login and OAuth redirect issues.

How it Works

Browser

 

Cloudflare

 

Prerender

 

Lovable

User or bot visits your domain

→

Routes the request

→

Intercepts bot requests, serves pre-rendered HTML

→

Hosts your site, continues working as normal

Nothing changes about how you use Lovable. You're only adding Cloudflare as the front door.

Before you start

You will need:

  • Your Lovable hosted URL (example: yourapp.lovable.app)

  • Your custom domain (example: yourapp.com)

  • Your Prerender token (available in your Prerender account)

  • Cloudflare account with your custom domain added (see setup instructions below)



Don't have Cloudflare set up?

Complete the Cloudflare setup first, then come back here and continue with the steps below. Here’s what the process involves:

  1. Create a free Cloudflare account: https://dash.cloudflare.com/sign-up
  2. Add your root domain (example: yourapp.com)
  3. Review your DNS records
  4. Log in to your domain registrar and replace the nameservers with Cloudflare's nameservers. The change propagation can take a few minutes up to a couple of hours, but you don't need to wait — continue to the next steps. Your custom domain may be temporarily unreachable during this time, but your site remains accessible via your Lovable hosted URL (yourapp.lovable.app).

Follow the detailed Cloudflare guide here.

 

Step 1: Create a Cloudflare Worker

  1. Log in to Cloudflare

  2. Go to  Compute → Workers & Pages

  3. Click Create application

  4. Choose Start with Hello World!

  5. Name it something like lovable-prerender

  6. Click Deploy

Step 2: Paste the Worker code

  1. In Cloudflare, open Compute → Workers & Pages → Your Worker

  2. Click Edit code

  3. Replace everything with the code on this link.

  4. Save and deploy

 

Step 3: Add your Prerender token to the Worker

  1. Open your Worker

  2. Go to Settings

  3. Find Variables and Secrets

  4. Add a Secret:

    • Name: PRERENDER_TOKEN

    • Type: Plaintext

    • Value: (paste your Prerender token)


  5. Add the Lovable Upstream as a secret
    • Name: LOVABLE_UPSTREAM
    • Type: Plaintext
    • Value: Lovable hosted address (example: https://yourapp.lovable.app)

  6. Deploy

 

Step 4: Attach your custom domain(s) to the Worker (Custom Domain)

This is the key step that makes your domain work reliably through Cloudflare. By attaching your domain directly to the worker, you avoid common errors like Error 1014 and Error 1000.

  1. In your Worker, open Settings

  2. Click +Add next to Domains & Routes



  3. Select Custom domain

  4. Enter your domain (add as many custom domains as you need, including www)
    Screenshot 2026-03-23 at 10.20.28

  5. Cloudflare will automatically create the needed DNS/certificate setup

 When done, Cloudflare DNS will show a special Worker mapping for your domain.
Screenshot 2026-03-23 at 10.28.59


Final Check: Verify Prerender Is Working

Option 1: Simulate a Googlebot visit in Chrome 

To confirm Prerender is working, you’ll simulate a Googlebot visit in Chrome and check the response headers for x-prerender-request-id. If this header is present, Prerender is serving pre-rendered HTML to bots and your integration is complete.

For the full step-by-step verification process, see: Verify Your Prerender Integration

Option 2: Verify Integration within your Prerender Account

Navigate to the Verify Integration step in your Prerender account and submit your domain for verification.

You’re all set!

Prerender will serve pre-rendered HTML to bots, while real users continue getting your Lovable site.

Support

If you encounter any issues with this integration, please contact our support team for assistance. 

Was this article helpful?