Skip to main content
For standard React applications — whether bootstrapped with Create React App or any other toolchain that serves a static public/index.html — the simplest installation path is to paste the Subtext capture snippet directly into the <head> of that file. The snippet loads asynchronously and begins recording sessions as soon as the page is visited, with no impact on your bundle size.
You can also run npx @subtextdev/subtext-wizard in your project root to have Subtext detect your framework and insert the snippet automatically. Follow this guide if you prefer to wire things up by hand.
1

Find your Org ID

Log in to Subtext and open Settings. Your Org ID is listed in the Capture section. Copy it — you will paste it in place of YOUR_ORG_ID in the snippet below.
2

Open public/index.html

Open public/index.html in your editor. This is the HTML shell that React mounts into — it is served for every route in your application. If you are using a custom HTML template, open that file instead.
3

Paste the snippet into the head

Add the snippet inside the <head> tag, just before the closing </head>. Replace YOUR_ORG_ID with the Org ID you copied from Subtext settings.
public/index.html
4

Start or rebuild your app

Run npm start (Create React App) or npm run dev (Vite-based setups) and open your application in a browser. For production, rebuild with npm run build and deploy normally — the snippet is embedded in the static HTML shell.
5

Verify capture is working

Navigate to a few pages in your app, then open Subtext → Sessions. A new session should appear within a minute or two.
Sessions typically appear within 30–60 seconds of page load. If nothing shows up, confirm that YOUR_ORG_ID was replaced with your actual Org ID and that public/index.html is the HTML file being served by your development server.
The snippet records full production sessions and masks all form inputs by default. Your agent can flag additional PII and propose masking rules for your review from within Subtext.