Setup turnstile on website

Website, Application, Performance
1

Hello, I want to setup turnstile for my website. If user open my website then they will face the automatic captcha verification then they can website. I have done below steps:

I put this code in header.php

<script src="https://challenges.cloudflare.com/turnstile/v0/api.js?onload=onloadTurnstileCallback" async defer></script>
      <script src="https://challenges.cloudflare.com/turnstile/v0/api.js"></script>

and I added below code in middle of the php page

<script type="text/javascript">
    window.onloadTurnstileCallback = function () {
    turnstile.render('abcdef', {
        sitekey: '0x4AAAAAAADch0Ba3E6N-jTt',
        callback: function(token) {
            console.log(`Challenge Success ${token}`);
        },
    });
};

// if using synchronous loading, will be called once the DOM is ready
turnstile.ready(onloadTurnstileCallback);
</script>

Here abcdef is div class= “abcdef”
but it is not working. Can you please help me to setup?

2

anyone please help?