OpenHermit automatically injects WebMCP (W3C Web Model Context Protocol) attributes into your website's forms and actions, making them instantly discoverable by AI agents like ChatGPT, Claude, and custom AI tools.
Like a hermit crab finding the perfect shell — instant, automatic, perfect.
- 🦀 Automatic WebMCP injection - Detects forms, calculators, booking widgets
- 🤖 AI agent tracking - Know which agents visit and what they do
- 🎯 Zero configuration - Works out of the box
- 🔧 Customizable - Configure agent prompts and behavior
- 📊 Real-time analytics - Dashboard at openhermit.com
- 🚀 Lightweight - 19.7 KB vanilla JavaScript, zero dependencies
Sign up at openhermit.com to get your free API key.
<script
src="https://cdn.openhermit.com/v1/openhermit.js"
data-api-key="your-api-key-here"
async
></script>That's it! Your website is now agent-ready.
<script
src="https://cdn.openhermit.com/v1/openhermit.js"
data-api-key="YOUR_API_KEY"
async
></script>npm install @openhermit/jsimport OpenHermit from '@openhermit/js';
OpenHermit.init({
apiKey: 'YOUR_API_KEY',
apiBase: 'https://www.openhermit.com' // optional
});Download src/openhermit.js and host it yourself:
<script
src="/path/to/openhermit.js"
data-api-key="YOUR_API_KEY"
data-api-base="https://your-api.com" // optional
async
></script>| Attribute | Required | Description |
|---|---|---|
data-api-key |
Yes | Your OpenHermit API key |
data-api-base |
No | Custom API endpoint (default: https://www.openhermit.com) |
If you're self-hosting the OpenHermit platform:
<script
src="https://cdn.openhermit.com/v1/openhermit.js"
data-api-key="YOUR_API_KEY"
data-api-base="https://your-custom-api.com"
async
></script>OpenHermit automatically:
- Detects forms - Contact forms, signups, newsletters, bookings, etc.
- Injects WebMCP attributes - Adds
data-mcp-action,data-mcp-description,data-mcp-params - Detects third-party widgets - Calendly, Typeform, HubSpot, Intercom
- Extracts business info - Phone, email, address from Schema.org or page content
- Tracks agent interactions - Knows when AI agents visit and what they do
- Serves manifest - Provides WebMCP-compliant manifest at
/api/manifest
OpenHermit detects and tracks:
- ChatGPT (GPTBot, ChatGPT-User)
- Claude (ClaudeBot, Claude-Web)
- Perplexity (PerplexityBot)
- Google Gemini (Google-Extended)
- Microsoft Copilot
- OpenAI Operator
- Custom agents via user-agent detection
<!DOCTYPE html>
<html>
<head>
<title>My Website</title>
</head>
<body>
<form action="/contact" method="POST">
<input type="email" name="email" required>
<textarea name="message" required></textarea>
<button type="submit">Send</button>
</form>
<!-- OpenHermit will automatically detect this form and inject WebMCP attributes -->
<script
src="https://cdn.openhermit.com/v1/openhermit.js"
data-api-key="YOUR_API_KEY"
async
></script>
</body>
</html>import { useEffect } from 'react';
function App() {
useEffect(() => {
const script = document.createElement('script');
script.src = 'https://cdn.openhermit.com/v1/openhermit.js';
script.setAttribute('data-api-key', 'YOUR_API_KEY');
script.async = true;
document.head.appendChild(script);
}, []);
return (
<form action="/contact" method="POST">
<input type="email" name="email" required />
<textarea name="message" required />
<button type="submit">Send</button>
</form>
);
}// app/layout.js
export default function RootLayout({ children }) {
return (
<html>
<head>
<script
src="https://cdn.openhermit.com/v1/openhermit.js"
data-api-key={process.env.NEXT_PUBLIC_OPENHERMIT_KEY}
async
/>
</head>
<body>{children}</body>
</html>
);
}Add to your theme's footer.php or use a plugin like "Insert Headers and Footers":
<script
src="https://cdn.openhermit.com/v1/openhermit.js"
data-api-key="YOUR_API_KEY"
async
></script>OpenHermit uses vanilla ES5 JavaScript and works on:
- ✅ Chrome/Edge (all versions)
- ✅ Firefox (all versions)
- ✅ Safari (all versions)
- ✅ IE 11+ (yes, really)
- ✅ Mobile browsers
- No PII collected - Only tracks agent interactions, not user data
- No cookies - Fully cookieless tracking
- No external dependencies - Self-contained script
- Open source - Inspect the code yourself
- Fail-safe - Never breaks your website (wrapped in try/catch)
git clone https://github.com/openhermit/openhermit-js.git
cd openhermit-js
npm install
npm run buildnpm testOpenHermit implements the W3C Web Model Context Protocol (WebMCP) specification for AI agent discoverability. WebMCP is an emerging W3C standard that defines how websites expose actions and capabilities to AI agents through the navigator.modelContext browser API and HTML data attributes.
The script also registers detected forms as browser tools via navigator.modelContext.registerTool() when supported, making your site natively discoverable by WebMCP-compatible AI browsers.
Example injected attributes:
<form
data-mcp-action="submit_contact_form"
data-mcp-description="Submit a contact form inquiry to the business"
data-mcp-params='[{"name":"email","type":"email","required":true},{"name":"message","type":"textarea","required":true}]'
data-openhermit="true"
>
...
</form>Get real-time insights at openhermit.com:
- Which AI agents visit your site
- What forms/actions they interact with
- Conversion rates and success metrics
- Custom agent prompts and behavior controls
We welcome contributions! Please see CONTRIBUTING.md for guidelines.
- Discord — Chat, get help, share what you're building
- Documentation
- Report Issues
MIT License - see LICENSE for details.
Made with 🦀 by the OpenHermit team
