⚛️ OTTO Not Rendering on React or Lovable SPA Sites

Camilo Aponte

Camilo Aponte

Last updated on Sep 30, 2026

🔍 Why OTTO Changes Don't Appear on Your Live Site

OTTO deploys SEO changes by injecting updated meta tags via a script in your site's . On traditional HTML sites this works without issue. On React, Lovable, and other single-page application (SPA) frameworks, these frameworks manage their own metadata through JavaScript libraries (e.g. react-helmet) that run on every page render and overwrite OTTO's injected values. OTTO automatically detects SPA frameworks and uses JavaScript rendering for re-crawls, but this client-side overwrite is a code-level conflict that still requires one of the fixes below.

This is why OTTO correctly reports the deployment as Engaged — the deployment is working. The conflict happens after the page loads, when the framework replaces OTTO's tags with its own values.

✅ How to Confirm This Is Your Issue

  • In Left sidebar → OTTO SEO → All Sites, OTTO shows the deployment as Engaged or Deployed
  • Clearing cache still shows old title/meta description
  • Your site was built with React, Next.js, Vite, or generated by Lovable
  • Lovable sites only — Cloudflare Worker installation: there is a known issue where the Cloudflare Worker install method silently proxies apex and www DNS records, which can break sites hosted on Lovable. If your Lovable-hosted site stopped loading correctly after OTTO installation, switch to the standard script tag installation method while this is being resolved.

🛠️ Two Ways to Fix It

  1. Adjust script load order — Modify your app's entry point so the Search Atlas script loads before React's metadata manager initializes.
  2. Use the OTTO API integration — Write SEO values directly into your codebase via API. This is the recommended approach for React and Lovable sites. Contact support to request setup credentials and the guide.

💬 Still need help?

If you need further assistance, open the chat widget in the bottom-right corner of the platform and type human teammate to be connected with a member of our team.

Additional Notes

For Lovable sites, the OTTO script must be added to the index.html file inside the head tag — not inside any React component. Place the script as early as possible in the head section, before any other JavaScript files. Also: check View Page Source vs DevTools Elements tab to distinguish raw HTML vs rendered DOM conflicts.