Cara Membuat Recapctha Di Blogspot Panduan Lengkap Sampai Berfungsi.
 |
| Membuat Popup Recapctha Muncul Menghilang Otomatis 12Jam Sekali |
Pernah gak kamu pas membuat artikel baru, belum terindeks sama sekali tiba-tiba sudah dikunjungi sampai puluhan kali ?.
Pasti kamu sangat aneh bukan, dan kamu pasti berfikir darimana sumbernya padahal artikelnya saja belum ke indeks sama sekali.
Jika itu terjadi maka fiks 100% kalo itu adalah bot yang mengunjungi. Lalu gimana cara mencegah bot masuk ke website kita ?
Ya caranya dengan menambahkan recapctha pada website yang dibuat.
Nah pada kesempatan kali ini saya akan memberikan Cara Membuat Recapctha Di Website / Blogger .
Namun sebelum anda ke tutorialnya yuk cari tahu bersama dahulu mengenai recapctha dan manfaatnya.
reCAPTCHA adalah sistem CAPTCHA (Challenge-Response Automated Public Turing test to tell Computers and Humans Apart) yang dikembangkan oleh Google untuk membantu membedakan antara manusia dan bot.
Bagaimana Cara Kerja Recapctha?
reCAPTCHA menghadirkan tantangan kepada pengguna, seperti:
Membaca teks yang terdistorsi: Teks yang ditampilkan sengaja dibuat sulit dibaca oleh bot, tetapi mudah dibaca oleh manusia.
Mencocokkan gambar: Pengguna diminta untuk memilih gambar yang sesuai dengan kategori tertentu, seperti "mobil", "trotoar", atau "pepohonan".
Menyelesaikan teka-teki: Pengguna diminta untuk menyelesaikan teka-teki sederhana yang mudah bagi manusia, tetapi sulit bagi bot.
Jika pengguna dapat menyelesaikan tantangan dengan benar, mereka dianggap sebagai manusia dan diizinkan untuk melanjutkan. Bot, di sisi lain, biasanya gagal menyelesaikan tantangan dan diblokir dari mengakses situs web atau layanan.
Jenis reCAPTCHA Yang Harus Diketahui:
Ada tiga versi utama reCAPTCHA:
reCAPTCHA v1: Versi ini menampilkan gambar CAPTCHA teks yang terdistorsi.
reCAPTCHA v2: Versi ini menampilkan gambar CAPTCHA "Saya bukan robot" yang meminta pengguna untuk mencentang kotak. reCAPTCHA v2 juga dapat menampilkan gambar CAPTCHA tambahan jika sistem mencurigai aktivitas bot.
reCAPTCHA v3: Versi ini berjalan di belakang layar dan memberikan skor risiko untuk setiap interaksi. Skor ini digunakan oleh pemilik situs web untuk menentukan apakah mereka perlu mengambil tindakan tambahan, seperti menampilkan CAPTCHA kepada pengguna.
Apa Saja Manfaat reCAPTCHA:
reCAPTCHA menawarkan beberapa manfaat, di antaranya:
Melindungi situs web dari spam dan penyalahgunaan: reCAPTCHA dapat membantu memblokir bot yang mencoba melakukan tindakan berbahaya seperti mengisi formulir spam, membuat akun palsu, atau menyebarkan malware.
Meningkatkan keamanan: reCAPTCHA dapat membantu meningkatkan keamanan situs web dengan membuat lebih sulit bagi peretas untuk mengakses akun pengguna atau melakukan tindakan jahat lainnya.
Meningkatkan pengalaman pengguna: reCAPTCHA v3 berjalan di belakang layar dan tidak mengganggu pengguna, sehingga memberikan pengalaman pengguna yang lebih baik.
Kekurangan reCAPTCHA:
reCAPTCHA juga memiliki beberapa kekurangan, di antaranya:
Aksesibilitas: Beberapa orang dengan disabilitas mungkin kesulitan menyelesaikan tantangan reCAPTCHA.
Ketidaknyamanan: Pengguna mungkin merasa jengkel harus menyelesaikan CAPTCHA, terutama jika mereka harus melakukannya berulang kali.
Penyalahgunaan: Bot canggih terkadang dapat melewati reCAPTCHA, sehingga tidak sepenuhnya aman.
Secara keseluruhan, reCAPTCHA adalah alat yang ampuh untuk melawan spam dan penyalahgunaan otomatis. Meskipun memiliki beberapa kekurangan, manfaatnya umumnya lebih besar. Jika Anda memiliki situs web, Anda harus mempertimbangkan untuk menggunakan reCAPTCHA untuk melindunginya dari bot.
Nah setelah kita mengetahui bersama tentang recapctha, jenis recapctha, manfaat recapctha, kekurangan recapctha.
Seperti yang sudah dijelaskan pada kekurangan recapctha yang paling besar adalah Ketidaknyamanan: Pengguna mungkin merasa jengkel harus menyelesaikan CAPTCHA, terutama jika mereka harus melakukannya berulang kali.
Oleh sebab itu okayim.com akan membuat recapctha hanya muncul satu kali dengan popup setelah pengunjung verifikasi recapctha maka popup otomatis hilang dan hanya akan muncul kembali setelah 12 jam kemudian.
Dengan sistem yang saya buat ini bisa memberikan kenyamanan pada pengunjung website kamu. Mereka gak akan merasa terganggu kenyamanannya sedikitpun.
Panduan Cara Membuat Recapctha Di Website
Langkah pertama untuk membuat recapctha di website atau blog yaitu harus mendaftar aku recapctha Console terlebih dahulu.
Berikut adalah panduan cara mendaftar reCAPTCHA:
Langkah 1: Buat Akun Google
Langkah 2: Buka Konsol Admin Google reCAPTCHA
Langkah 3: Daftarkan Situs Web Anda
Klik tombol "Daftar Situs Baru". Masukkan nama domain situs web Anda dan pilih jenis reCAPTCHA yang ingin Anda gunakan.
Langkah 4: Dapatkan Kunci Situs dan Kunci Rahasia
Setelah Anda mendaftarkan situs web Anda, Anda akan mendapatkan kunci situs dan kunci rahasia. Simpan kunci ini dengan aman, karena Anda akan membutuhkannya nanti untuk mengintegrasikan reCAPTCHA ke situs web Anda.
Catatan:
Anda dapat mendaftarkan beberapa situs web ke konsol Admin Google reCAPTCHA.
Anda dapat mengubah jenis reCAPTCHA yang Anda gunakan kapan saja.
Anda dapat melihat statistik tentang penggunaan reCAPTCHA di situs web Anda di konsol Admin Google reCAPTCHA.
Cara Membuat Recapctha Saya Bukan Robot Di Blog / Website
<script async='async' defer='defer' src='https://www.google.com/recaptcha/api.js'>
<style>
body {
font-family: Arial, sans-serif;
}
.popup {
display: none; /* Tersembunyi secara default */
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(0,0,0,0.5);
justify-content: center;
align-items: center;
z-index: 1000;
}
.popup-content {
background-color: #fff;
padding: 20px;
border-radius: 5px;
box-shadow: 0 0 10px rgba(0,0,0,0.1);
text-align: center;
}
</style>
<div id="recaptcha-popup" class="popup">
<div class="popup-content">
<h1>Saya Tahu Anda Bukan Robot, Oleh Sebab Itu Silahkan Centang Kotak Di Bawah ini</h1>
<br />
<div class="g-recaptcha" data-sitekey="masukan kunci situs recapctha anda disini" data-callback="recaptchaCallback"></div>
</div>
</div>
<script>
// Simpan status validasi di localStorage
var validated = false;
// Periksa apakah pengguna sudah divalidasi
function isUserValidated() {
return localStorage.getItem('validated') === 'true';
}
// Tandai pengguna sebagai terverifikasi
function markUserValidated() {
localStorage.setItem('validated', 'true');
}
// Callback function for reCAPTCHA verification
function recaptchaCallback(token) {
console.log('Token:', token);
markUserValidated();
document.getElementById('recaptcha-popup').style.display = 'none';
}
// Tampilkan pop-up jika pengguna belum divalidasi
window.onload = function() {
if (!isUserValidated()) {
document.getElementById('recaptcha-popup').style.display = 'flex';
}
};
</script>