TokoDaring.Com – Cara Menambahkan Recaptcha Di Website WordPress WooCommerce. Salah satu cara kalsik untuk memerangi bot spam adalah dengan memasang kode CAPTCHA di form-form masuk ke dalam website, baik form registrasi, login, comment dan formlainnya. Untuk website WordPress pasti semudah memasang plugin recaptcha, tapi artikel ini akan menerangkan cara menambahkan reCAPTCHA di website WordPress WooCommerce tanpa plugin.

Cara Menambahkan Recaptcha Di Website WordPress WooCommerce

Artikel Terkait :
Menggunakan WordPress & WooCommerce Sesuai Skala Bisnis

Recaptcha akan kita pasangkan pada halaman-halaman berikut:

Bagian komentar post
Halaman login, Registrasi dan lost password

Yang pertama adalah kita harus mendapatkan 2 jenis key yang bisa di dapatkan di halaman Google recaptcha, https://www.google.com/recaptcha/. Dari halaman recaptcha Google, isi beberapa informasi dan tipe captcha yang ingin anda gunakan:

Isikan label nama website
Pilih reCAPTCHA v2
Pilih [Kotak Centang “i’am not robot”]
Masukkan alamat URL domain Anda
Masukkan alamat email administrator situs website
Terima Persyaratan Layanan reCAPTCHA
Kemudian klik tombol kirim.

Setelah melengkapi formulir, Anda akan menerima 2 kode yaitu site key dan secret key, keduanya nantinya akan di gunakan ke dalam kode yang akan di masukan ke website WordPress. Untuk memasukan dua key code tersebut ke dalam WordPress, hanya bisa dimungkinkan dengan merubah file function.php di dalam theme editor.

Tapi melakukannya secara langsung akan beresiko merusak situs website anda, kembali ke artikel kami terdahulu, bahwa kita bisa mengkustom website WordPress dengan mengkatrol hook menggunakan child theme atau plugin editor, lihat artikelnya di, Cara Edit Website WordPress.

Masukan potongan kode berikut ke dalam file plugin atau file function.php child theme.

function my_recaptcha_key(){
	$sitekey= "abcdeFGHiJhk123456789";
	$secretkey= "abcdeFGHiJhk987654321";
	return explode(",", $sitekey.",".$secretkey ); 	
}

Cara menambahkan recaptcha di kolom komentar

Bagian website yang sering menjadi sasaran spam adalah seksi komentar yang terbuka. Jadi penting untuk menambahkan kunci captcha pada bagian itu. Untuk melakukannnya tambahkan potongan kode berikut di bagian bawah kode di atas yang sudah di tambahkan.

/*
 * Add reCAPTCHA to WordPress Comment Section
 */

add_action( 'wp_head', function() {
wp_enqueue_script('google-recaptcha', 'https://tokodaring.com/wp-content/litespeed/localres/aHR0cHM6Ly93d3cuZ29vZ2xlLmNvbS9yZWNhcHRjaGEvYXBpLmpz');
} );

function add_google_recaptcha($submit_field) {
    $submit_field['submit_field'] = '<div class="g-recaptcha" data-sitekey="'.my_recaptcha_key()[0].'"></div><br>' . $submit_field['submit_field'];
    return $submit_field;
}

if (!is_user_logged_in()) {
add_filter('comment_form_defaults','add_google_recaptcha');
}

function is_valid_captcha($captcha) {
    $captcha_postdata = http_build_query(array(
        'secret' => my_recaptcha_key()[1],
        'response' => $captcha,
        'remoteip' => $_SERVER['REMOTE_ADDR']));
    $captcha_opts = array('http' => array(
        'method'  => 'POST',
        'header'  => 'Content-type: application/x-www-form-urlencoded',
        'content' => $captcha_postdata));
    $captcha_context  = stream_context_create($captcha_opts);
    $captcha_response = json_decode(file_get_contents("https://www.google.com/recaptcha/api/siteverify", false, $captcha_context), true);
if ($captcha_response['success'])
    return true;
else
    return false;
}
 
function verify_google_recaptcha() {
    $recaptcha = $_POST['g-recaptcha-response'];
if (empty($recaptcha))
    wp_die( __("<b>ERROR:</b> please select <b>I'm not a robot!</b><p><a href='javascript:history.back()'>« Back</a></p>"));
else if (!is_valid_captcha($recaptcha))
    wp_die( __("<b>Go away SPAMMER!</b>"));
}
if (!is_user_logged_in()) {
    add_action('pre_comment_on_post', 'verify_google_recaptcha');
}

Anda mungkin sering menerima registrasi yang ‘enggak jelas’ dari halaman registrasi dan login ? Cara menambahkan recaptcha di Halaman Login WordPress, copy kode berikut ke dalam file plugin atau file function.php child theme.

/*
 * Add reCaptcha on WordPress Admin Login Page Without Plugin
 */

function login_style() {
    wp_register_script('login-recaptcha', 'https://tokodaring.com/wp-content/litespeed/localres/aHR0cHM6Ly93d3cuZ29vZ2xlLmNvbS9yZWNhcHRjaGEvYXBpLmpz', false, NULL);
    wp_enqueue_script('login-recaptcha');
}

add_action('login_enqueue_scripts', 'login_style');
function add_recaptcha_on_login_page() {
    echo '<div class="g-recaptcha brochure__form__captcha" data-sitekey="'.my_recaptcha_key()[0].'"></div>';
}

add_action('login_form','add_recaptcha_on_login_page');
function captcha_login_check($user, $password) {
    if (!empty($_POST['g-recaptcha-response'])) {
        $secret = my_recaptcha_key()[1];
        $ip = $_SERVER['REMOTE_ADDR'];
        $captcha = $_POST['g-recaptcha-response'];
        $rsp = file_get_contents('https://www.google.com/recaptcha/api/siteverify?secret=' . $secret . '&response=' . $captcha .'&remoteip='. $ip);
        $valid = json_decode($rsp, true);
        if ($valid["success"] == true) {
            return $user;
        } else {
            return new WP_Error('Captcha Invalid', __('<center>Captcha Invalid! Please check the captcha!</center>'));
        }
    } else {
        return new WP_Error('Captcha Invalid', __('<center>Captcha Invalid! Please check the captcha!</center>'));
    }
}
add_action('wp_authenticate_user', 'captcha_login_check', 10, 2);

Untuk menambahkan recpatcha pada halaman my-account WooCommerce, hook ke woocommerce_login_form

Artikel terkait :

Cara Menambahkan Recaptcha Di Website WordPress WooCommerce

Table of Contents