Tutorial kali ini Crepictdesign ingin bagikan kode CSS
anti klik kanan ( area select block ), saya sengaja tidak menggunakan Javascript yang sudah umum menjadi
tutorial dan sudah banyak dibagikan oleh para Sobat blogger. Disamping terlalu banyak Jacascript membuat
Loading Blog semakin berat jadi saya gunakan CSS sebagai alternative kode
anti copasnya.
Kenapa saya tidak menggunakan Javascript? Salah satu alasannya adalah tiap browser memiliki tips bagaimana cara menon-aktifkan java script, Nah..ketika javascript tidak diaktifkan pada browser yang digunakan oleh pengguna maka ARTIKEL kita akan dengan mudah di copy paste.
Jika terlalu banyak javascript yang ada di dalam templatepun menjadikan loading Blog semakin berat, artinya meminimalkan penggunaan Javascript di dalam Blog adalah baik untuk meringankan loading Blog itu sendiri.
Pada dasarnya kod CSS Anti COPAS berfungsi untuk melarang user mem block/select tulisan yang ada pada class tertentu, atau CLASS yang sudah kita tentukan akan secara otomatis tidak bisa di select ( select area ) jadi tentu saja tidak bisa di copy paste.
Langsung saja pada tutorial dibawah ini :
Cara Memasang Kode Anti
Copas untuk Blog dengan CSS
Dasar
Kode Anti COPAS dengan CSS
/* Basic code CSS anti copas */
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-o-user-select: none;
user-select: none;
Diatas adalah kode basic
atau dasarnya saja, jadi tidak langsung kita terapkan di Blog.
Cara Memasang pada Template Blog
Masuk ke Akun Blogger Sobat :
1. Klik templat dan klik edit HTML
2. Carilah kode ]] >< /b:skin>gunakan Ctrl + F untuk memudahkan pencarian dan klik Enter
3. Letakkan kode di bawah ini di atas kode ]] >< /b:skin>atau</ style>lalu klik simpan
1. Kode anti copas seluruh
isi Blog
Pemasangan kode Anti copas dibawah ini cocok untuk Blog Pribadi ( Personal Blog )
body{display:block;-khtml-user-select:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;-o-user-select:none;user-select:none;unselectable:on;}
Jika sudah selesai klik Simpan Template.
Pemasangan Kode CSS di atas memungkinkan semua artikel atau semua postingan tidak akan bisa di copy paste oleh pengunjung Blog.
2. Kode Anti copas pada
CLASS tertentu saja
Jika Sobat ingin menseleksi
mana artikel yang boleh di Copy Paste dan mana mana yang tidak boleh di copy
paste maka Sobat harus menambahkan (
CLASS tertentu ) agar tidak bisa di copy
paste.
Pemasangan kode Anti COPAS
pada class POSTBODY
Cara pemasangannya sama seperti pada langkah pertama ya Sob …!.
Pada CLASS area postbody ini seluruh area postingan artikel Sobat tidak bisa di copy paste. Kodenya adalah tersebut dibawah ini :
.post-body{-webkit-touch-callout: none;-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;-o-user-select:none;user-select: none;}
Setelah itu tekan Simpan Template
Pada bagian ini semua area postingan Blog Sobat tidak bisa di copy paste..!
Pertanyaannya : Lho bagaimana dengan kode CSS,Javascript,jQuery,HTML yang saya bagikan agar bisa di copas ??? Jawabannya adalah tidak bisa di copas juga...
Tutorial dibawah ini adalah Jawaban agar kode CSS,Javascript,jQuery,HTML yang Sobat bagikan bisa di copas oleh pengunjung Blog.
3. Pengecualian kode COPAS pada CLASS
tertentu saja ( bisa di copas )
Kode dibawah ini adalah
pengecualian dari semua kode diatas yaitu membolehkan pengunjung meng-copy
paste area tertentu atau CLASS tertentu. Kodenya adalah dibawah ini :
pre,code{-webkit-touch-callout:text;-webkit-user-select:text;-moz-user-select:text;-ms-user-select:text;-o-user-select:text;user-select:text}
Setelah itu Simpan Template
Catatan : pre,code adalah class tertentu yang umum digunakan oleh Admin Blog dalam membagikan tutorial berupa kode CSS,Javascript,jQuery,HTML dsb.
Jika Sobat menggunakan CLASS yang lain silahkan ganti CLASS pre,code dengan CLASS milik sobat.
Demikian Tutorial Cara
Memasang Kode Anti COPAS dengan CSS, semoga penjalasan saya mudah dimengerti
dan bermanfaat bagi Sobat blogger semuanya. Silahkan tulis komentar jika ada
pertanyaan seputar tutorial diatas jika Sobat menemukan masalah dalam
penerapannya.
Semoga bermanfaat….