Float mode
The widget renders inline on the page; the user completes verification before submitting your form. View source.
Live demo
Interact with the widget below to verify.
Integration code
<script src="https://cdn.captcha-cdn.net/captchala.js"></script> <form id="signup"> <input name="email" type="email" required> <input name="password" type="password" required> <div id="captcha"></div> <!-- widget mounts here --> <input name="captcha_token" type="hidden"> <button type="submit">Sign up</button> </form> <script> Captchala.init({ appKey: 'YOUR_APP_KEY', product: 'float', container: '#captcha', action: 'register', lang: 'en', onSuccess: (res) => { // Stash token in hidden field, let the user submit normally. document.querySelector('[name=captcha_token]').value = res.token; } }); </script>
When to use float
Long forms where the user fills multiple fields before submitting. The widget verification can complete while they're still typing — when they hit submit, the token is already in hand. Lower perceived latency than popup for multi-step flows.