Script Open New Tab Url Untuk Sekali Klik

Kali ini admin akan membagikan sebuah script yang berfungsi untuk membuka url di tab baru ketika pengunjung mengklik halaman web kita. Script ini akan membuka tab baru untuk sekali klik. Klik selanjutnya tidak akan memberikan efek. Efek open new tab hanya berjalan pada klik pertama kali.

Script ini banyak digunakan di beberapa web seperti web safelink, web film, web musik dan web download. Tujuan dipasang script ini yaitu untuk menambah penghasilan dari iklan atau menambah jumlah impresi dari pemasang iklan.

Berikut ini scriptnya :

<script>
//<![CDATA[
document.body.addEventListener("click", function () {
    var a = document.createElement('a');
    a.target = "_blank";
    a.href = "https://namaDomain.com";
    a.click();
}, {
    once: true
});
//]]>
</script>

Silahkan ganti tulisan yang saya beri warna merah dengan alamat url yang ingin dibuka.

Cara Pemasangan Script

Script ini dapat kamu pasang pada html sebelum element </body>. Untuk Pengguna blogger, kamu dapat memasangnya di bagian edit html atau di bagian widget Javascript.

Berikut cara pemasangannya untuk pengguna blogger:

1. Silahkan buka dashboard blogger kamu.
2. Pilih 'Tema' lalau pilih 'Edit HTML'.
3. Setelah itu cari kode '</body>' lalu pastekan script tepat di atasnya.
4. Jangan lupa untuk mengubah url yang saya beri warna merah dengan url yang kamu inginkan.
5. Lalu pilih 'Simpan Tema'.
6. Selesai.

Untuk mencobanya, silahkan kamu klik di area mana saja. Jika berhasil maka klik pertama kali akan membuka tab baru dengan alamat url yang telah kamu rubah sebelumnya. Klik kedua kali tidak akan memberikan efek apapun.

Cara Kerja Script

Mula - mula script ini akan memberikan perintah event klik kepada seluruh DOM body. Artinya efek klik akan bekerja jika pengunjung mengklik pada area DOM body.

document.body.addEventListener("click", function () {

});

Karena kita hanya memberikan perintah 'Sekali klik', maka kita harus memberikan option event untuk sekali klik seperti berikut :

document.body.addEventListener("click", function () {

}, {
    once: true
});

Terlihat bahwa saya menambahkan option event berupa "once:true" dimana option ini akan memberikan perintah untuk dijalankan dengan sekali klik.

Selanjutnya efek klik akan menjalankan sebuah fungsi untuk membuat DOM <a> dan mengisi beberapa attribute seperti target dan href. Perhatikan script dibawah ini, Lihat tulisan yang saya beri warna hijau.

document.body.addEventListener("click", function () {
    var a = document.createElement('a');
    a.target = "_blank";
    a.href = "https://namaDomain.com";
    a.click();
}, {
    once: true
});

Ketika klik pertama kali di lakukan, maka script akan membuat DOM <a> dengan mengisi attribute target dan href. Jika kita ilustrasikan, maka DOM <a> tersebut akan menjadi seperti berikut :

<a target="_blank" href="https://namaDomain.com"></a>

Setelah DOM <a> terbentuk, maka fungsi click() akan dijalankan yang akan meng-klik secara otomatis dan akhirnya terbukalah tab baru dengan url yang telah kita set sebelumnya.

Begitulah lebih kurang cara kerja script tersebut. Jika kamu ada pertanyaan silahkan beri komentar di bawah. Semoga artikel ini bermanfaat.