Skip to main content

​
Step 1 — Create an account

Go to openhermit.com/register and create a free account.

​
Step 2 — Add your website

In your dashboard, click + Add Website. Enter your website’s name and domain (e.g. example.com). OpenHermit generates a unique API key for your site.

​
Step 3 — Install the script

Copy the generated script tag and paste it into every page of your website, just before the closing </body> tag. 
<!-- OpenHermit WebMCP Script -->
<script
  src="https://openhermit.com/script.js"
  data-api-key="YOUR_API_KEY"
  async>
</script>
Add to your root app/layout.tsx using the Next.js Script component so it loads on every page:
import Script from 'next/script';

export default function RootLayout({ children }) {
  return (
    <html>
      <body>
        {children}
        <Script
          src="https://openhermit.com/script.js"
          data-api-key="YOUR_API_KEY"
          strategy="afterInteractive"
        />
      </body>
    </html>
  );
}
Use strategy="afterInteractive" — this ensures the script runs after React hydration so dynamically rendered forms are visible.

​
Step 4 — Verify installation

After pasting the script, visit any page on your website in a browser. Within a few seconds, your dashboard will show:
✓ Script active · Last seen just now
If the badge stays amber (“Script not yet detected”), check that:
  • The script tag is present in your page’s HTML source (Ctrl+U / Cmd+U to view source)
  • The data-api-key matches the key shown in your dashboard
  • The script URL is accessible (not blocked by a CSP header)

​
Step 5 — Visit pages with forms

Visit the pages on your website that contain contact forms, booking widgets, or other interactive elements. The script detects them automatically and they appear in your Actions dashboard within seconds.

​
What’s next?

Configure Agent Prompts

Tell agents what to do before, during, and after each action

View Your Manifest

See exactly what AI agents see when they discover your site