Tutorial: Integrating Cloudflare Turnstile with Sngine
<h1>Tutorial: Integrating Cloudflare Turnstile with Sngine</h1>
<p>This tutorial will guide you through integrating <strong>Cloudflare Turnstile</strong> into your Sngine platform while keeping Google reCAPTCHA. Turnstile will be added to both the <strong>Contact Form</strong> and the <strong>Sign-Up Form</strong> for enhanced security.</p>
<h2>1. <strong>Upload the files<span style="color: rgb(53, 152, 219);"> (If you don't want to do the manual work)</span></strong></h2>
<p><strong><span style="color: rgb(224, 62, 45);">Skip step 3 if you just uploaded all the files, if you don't want to overwrite the file because you have a modified theme, continue to step 2</span></strong></p>
<p><strong><span style="color: rgb(224, 62, 45);">Download the<span style="color: rgb(132, 63, 161);"> zip</span> and upload to your <span style="color: rgb(132, 63, 161);">root</span>, pay attention that this files will be <spanoverwritten
style="color: rgb(132, 63, 161);">overwritten</span></span></strong></p>
<p><span style="color: rgb(132, 63, 161);"><strong>/includes/ajax/admin/settings.php</strong></span></p>
<p><span style="color: rgb(132, 63, 161);"><strong>/includes/class-user.php</strong></span></p>
<p><span style="color: rgb(132, 63, 161);"><strong>/content/themes/default/templates/admin.settings.tpl</strong></span></p>
<p><span style="color: rgb(132, 63, 161);"><strong>/content/themes/default/templates/contact.tpl</strong></span></p>
<p><span style="color: rgb(132, 63, 161);"><strong>/content/themes/default/templates/_sign_form.tpl</strong></span></p>
<hr>
<h2>2. Add the <strong> Database </strong></h2> <p>
Add new options for Cloudflare Turnstile in the database.</p>
<p>Use the file included visit yoursite.com/installCloud.php and run the script </p> <h3>
Or do it manually as it show bellow</h3>
<h3>Run the following SQL queries:</h3>
<pre><code class="language-sql">CREATE TABLE IF NOT EXISTS `system_options` (
`option_name` VARCHAR(255) NOT NULL,
`option_value` TEXT NOT NULL,
PRIMARY KEY (`option_name`)
);
INSERT INTO `system_options` (`option_name`, `option_value`) VALUES ('turnstile_enabled', '0');
INSERT INTO `system_options` (`option_name`, `option_value`) VALUES ('turnstile_site_key', '');
INSERT INTO `system_options` (`option_name`, `option_value`) VALUES ('turnstile_secret_key', '');
</code></pre>
<hr>
<h2>You are done if you have uploaded all the files</h2>
<p>Now visit yousite.com/admincp/settings/security and look for and add you key</p>
<p><img
src="https://scriptstribe.com/content/uploads/tutorials/cloudSet.png" alt=""
width="534"3. height="314"></p>
<h2> </h2>
<h2><span style="color: rgb(132, 63, 161);">3. <strong>Or Edit the code manually</strong></span></h2>
<h2>2. <strong>Admin Panel Settings</strong></h2>
<h3>Add Turnstile Settings in <code>Admin Settings</code>:</h3>
<p>Open /content/themes/default/templates/admin.settings.tpl</p>
<p><strong>Look For </strong></p>
<pre> <div class="row form-group">>
<br> <label class="col-md-3 form-label"><br>
{__("reCAPTCHA Site Key")}
<br> </label>>
<br> <div class="col-md-9"><br>
{if !$user->>_data['user_demo']}
<br> <input type="text" class="form-control" name="reCAPTCHA_site_key" value="{$system['reCAPTCHA_site_key']}"><br>
{else}
<br> <input type="password" class="form-control" value="*********"><br>
{/if}
<br> </div>>
<br> </div>>
<br><br> <div class="row form-group">>
<br> <label class="col-md-3 form-label"><br>
{__("reCAPTCHA Secret Key")}
<br> </label>>
<br> <div class="col-md-9"><br>
{if !$user->>_data['user_demo']}
<br> <input type="text" class="form-control" name="reCAPTCHA_secret_key" value="{$system['reCAPTCHA_secret_key']}"><br>
{else}
<br> <input type="password" class="form-control" value="*********"><br>
{/if}
<br> </div>>
<br> </div>>
<br> <!-- success --></pre>
<p><strong>And after this add
</strong></p>
<pre><code class="language-smarty"><!-- Cloudflare Turnstile Enabled -->>
<<div class="form-table-row">>
<<div class="avatar">>
{include file='__svg_icons.tpl' icon="shield" width="40px" height="40px"}
<</div>>
<<div>>
<<div class="form-label h6">>{__("Cloudflare Turnstile Enabled")}<</div>>
<<div class="form-text d-none d-sm-block">>{__("Enable or disable Cloudflare Turnstile security.")}<</div>>
<</div>>
<<div class="text-end">>
<<label class="switch" for="turnstile_enabled">>
<<input type="checkbox" name="turnstile_enabled" id="turnstile_enabled" {if $system['turnstile_enabled']}checked{/if}>>
<<span class="slider round"><></span>>
<</label>>
<</div>>
<</div>>
<<!-- Turnstile Site Key -->>
<<div class="row form-group">>
<<label class="col-md-3 form-label">>{__("Turnstile Site Key")}<</label>>
<<div class="col-md-9">>
<<input type="text" class="form-control" name="turnstile_site_key" value="{$system['turnstile_site_key']}">>
<</div>>
<</div>>
<<!-- Turnstile Secret Key -->>
<<div class="row form-group">>
<<label class="col-md-3 form-label">>{__("Turnstile Secret Key")}<</label>>
<<div class="col-md-9">>
<<input type="text" class="form-control" name="turnstile_secret_key" value="{$system['turnstile_secret_key']}">
</div>
</div>>
</code></prediv>
<hr/div>
<h2>
3. <strong>Save Turnstile Settings</strong></h2>
<h3>In <code>includes/ajax/admin/settings.php</code>, under the <strong>security</strong> case, add:</h3>
<pre><code class="language-php">case 'security':
$_POST['turnstile_enabled'] = (isset($_POST['turnstile_enabled'])) ? '1' : '0';
update_system_options([
'turnstile_enabled' =>> secure($_POST['turnstile_enabled']),
'turnstile_site_key' =>> secure($_POST['turnstile_site_key']),
'turnstile_secret_key' =>> secure($_POST['turnstile_secret_key']),
]);
break;
</code></pre>
<hr>
<h2>4. <strong>Add Turnstile to Forms (I added after the Recapcha code)</strong></h2>
<h3><strong>Contact Form</strong> (<code>contact.tpl</code>)</h3>
<pre><code class="language-smarty">{if $system['turnstile_enabled']}
<<div class="form-group">>
<<script src="https://challenges.cloudflare.com/turnstile/v0/api.js" async defer><></script>>
<<div class="cf-turnstile" data-sitekey="{$system['turnstile_site_key']}"><></div>>
<</div>>
{/if}
</code></pre>
<h3><strong>Sign-Up Form</strong> (<code>_sign_form.tpl</code> </h3> <pre><code
class="language-smarty">{if $system['turnstile_enabled']}
<<div class="form-group">>
<<script src="https://challenges.cloudflare.com/turnstile/v0/api.js" async defer><></script>>
<<div class="cf-turnstile" data-sitekey="{$system['turnstile_site_key']}"><></div>>
<</div>>
{/if}
</code></pre>
<hr>
<h2>5. <strong>Verify Turnstile on Submission</strong></h2>
<h3>In <code>class-user.php</code>, update the verification logic:</h3>
<p><strong>Look For</strong> </p> <div>
<pre> $custom_fields = $this->>set_custom_fields($args);<br><br>
/* check reCAPTCHA */<br><br>
if ($system['reCAPTCHA_enabled'] && $args['from_web']) {<br><br>
$recaptcha = new \ReCaptcha\ReCaptcha($system['reCAPTCHA_secret_key'], new \ReCaptcha\RequestMethod\CurlPost());<br><br>
$resp = $recaptcha->>verify($args['g-recaptcha-response'], get_user_ip());<br><br>
if (!$resp->>isSuccess()) {<br><br>
throw new ValidationException(__("The security check is incorrect. Please try again"));<br><br>
}<br><br>
}</pre>
<div><strong>
And after that add </strong></div> </div>
<pre><code
class="language-php">/* Check Cloudflare Turnstile */
if ($system['turnstile_enabled'] && $from_web) {
if (empty($_POST['cf-turnstile-response'])) {
throw new ValidationException(__("Please complete the Cloudflare security check."));
}
$verify_url = "https://challenges.cloudflare.com/turnstile/v0/siteverify";
$data = [
'secret' =>> $system['turnstile_secret_key'],
'response' =>> $_POST['cf-turnstile-response'],
'remoteip' =>> get_user_ip(),
];
$options = [
'http' =>> [
'header' =>> "Content-type: application/x-www-form-urlencoded\r\n",
'method' =>> 'POST',
'content' =>> http_build_query($data),
]
];
$context = stream_context_create($options);
$response = file_get_contents($verify_url, false, $context);
$result = json_decode($response);
if (!$result->>success) {
throw new ValidationException(__("The Cloudflare Turnstile check failed. Please try again."));
}
}
</code></pre>
<hr>
<h2>✅ <strong>Congrats</strong></h2>
<p>You've successfully integrated <strong>Cloudflare Turnstile</strong> into your Sngine platform alongside <strong>Google reCAPTCHA</strong>. Now your platform is doubly protected against spam and bot attacks!</p>
<hr>
<p><strong>Need Help?</strong> Visit the <a title="ScriptsTribe Forums" href="https://scriptstribe.com/forums">community forums</a>. </p>