Script
Load the HumanProof widget script once per page. Use defer so the browser can parse the page before registering the custom element.
<script src="https://humanproof.eu/widget.js" defer></script>Markup
<form method="POST" action="/contact">
<input type="email" name="email" required>
<human-proof
data-api-endpoint="https://humanproof.eu/api/captcha/site_your_public_key"
></human-proof>
<button type="submit">Send</button>
</form>Self-hosting
If a consent manager or corporate security gateway blocks third-party scripts, serve the same widget file from your own application, for example /assets/humanproof-widget.js. Keep data-api-endpoint pointed at HumanProof so domains, billing limits, agency client allocations, risk checks, and verification remain centralized.
Download the current compiled widget from the project integration tab or from the widget download endpoint. Re-download it after HumanProof widget updates if you self-host.
Token field
By default the widget creates a hidden input named humanproof-token. Change it with data-hidden-field-name if your backend expects another name.