10 July 2018

Proteksi Artikel Blog tidak dapat di copy

Pada Tutorial ini membahas tentang cara proteksi postingan blog agar tidak bisa di copy. Ada beberapa tips yang bisa digunakan untuk menghindari pengambilan konten dengan cara memproteksi postingan blog agar tidak langsung di copy secara langsung, sebenarnya ada banyak cara namun pada postingan ini akan menggunakan dua cara untuk proteksi postingan/artikel.

cara pertama adalah dengan menggunakan kode CSS (Cascade Style Sheet), cara kedua adalah dengan menggunakan javascript, berikut langkah-langkahnya:


Menggunakan Kode JavaScript

Kebanyakan Javascript sering di pakai untuk membuat halaman situs lebih interaktif, memberi kesan animasi dan lainnya, selain itu javascript dapat digunakan untuk membuat artikel postingan blog tidak dapat dikopi paste, atau artikel postingan kita tetap dapat dikopi paste namun ketika dikopi secara otomatis, link sumber akan disertakan, berikut langkah-langkahnya:


1. buka Blogger > Template > Edit HTML > Kemudian cari kode </head>.
2. copykan kode javascript berikut ini sebelum kode </head>.

 <script type="text/javascript"> function disableSelection(target){
if (typeof target.onselectstart!="undefined") //IE route
    target.onselectstart=function(){return false}
else if (typeof target.style.MozUserSelect!="undefined") //Firefox route
    target.style.MozUserSelect="none"
else //All other route (ie: Opera)
    target.onmousedown=function(){return false}
target.style.cursor = "default"
}
</script> 

3. Simpan Template

Menggunakan Script CSS

Salah satu cara yang bisa kita gunakan agar artikel postingan tidak bisa dikopi paste adalah dengan menggunakan script CSS, css sebenarnya digunakan untuk mengatur tata letak halaman situs sekaligus mengelola design atau mendekorasi halaman situs, namun CSS bisa kita gunakan untuk membuat artikel postingan tidak bisa di kopi paste secara langsung, berikut langkah-langkahnya:

1. silahkan buka Blogger > Template > Edit HTML > Kemudian cari kode ]]></b:skin>.
2. copykan kode CSS berikut ini sebelum
kode ]]></b:skin>.


 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;} 

Apabila anda menggunakan kode diatas, maka seluruh tampilan blog menjadi tidak dapat di seleksi dan tidak dapat dicopy karena kode diatas terpasang di TAG body, yang menyebabkan seluruh tampilan halaman tidak dapat dipilih, cara diatas kurang efektif, jika anda bermaksud untuk menonaktifkan (unselectable) hanya sebagian area, maka anda harus pasang kode diatas untuk TAG tertentu yang ingin dinonaktifkan.
Namun untuk menerapkannya anda harus mengetahui tag pada blog anda, agar dapat mengetahui bisa menggunakan fasilitas inspeksi element (Inspect Element) pada browser anda.

Contoh, anda ingin menonaktifkan hanya bagian postingan saja menjadi tidak dapat diseleksi, namun jika terdapat Quote didalam postingan harus bisa diseleksi, langkah-langkahnya adalah:

Cari nama TAG HTML untuk struktur postingan anda baik itu ID maupun classnya, misal nama tag id untuk postingan anda adalah <div id='post' ..... sedangkan nama tag id untuk quote postingan anda adalah <div class='my-quote', maka untuk menonaktifkan postingan kecuali quote harus tetap aktif adalah sebagai berikut:

-Agar postingan anda tidak dapat dikopi paste, maka pasang kode diatas untuk tag HTML postingan anda melalui ID tag (id='post'), lihat ilustrasi diatas, kode yang harus anda pasang adalah sebagai berikut:

 #post{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 anda hanya memasang kode diatas, maka seluruh area yang ada didalam postingan menjadi tidak bisa dikopi paste, oleh karena itu jika anda menginginkan beberapa bagian didalam area postingan, misalnya quote ingin tetap bisa di seleksi dan dicopy, maka anda tambahkan lagi kode dibawah ini:

-Agar Quote yang ada didalam postingan aktif, maka anda harus memasang kode tersebut di TAG HTML untuk Quote, dalam hal ini kita pasang di attribut kelasnya, kode yang harus anda pasang selanjutnya adalah:

 #post .my-quote{display:block;
-khtml-user-select:text;
-webkit-user-select:text;
-moz-user-select:text;
-ms-user-select:text;
-o-user-select:text;
user-select:text;
unselectable:off;} 

kode diatas tentu saja disarankan diletakan sebelum kode </head> dan bungkus kode diatas diantara kode
.<style type='text/css'>.
---------pasang kode-kode diatas diarea ini--------
.</style>.


Sekarang anda telah mengetahui cara menghindari kopi paste dengan kedua cara diatas, lantas mana yang lebih baik, menurut saya pribadi yang lebih baik adalah yang menggunakan kode CSS, kelemahan menggunakan kode Javascript adalah bisa diakali dengan mendisable javascript pada browser, kopi paste akan tetap berjalan, kedua-duanya perlu dicoba, jika perlu gunakan kedua script diatas.



0 komentar:

Post a Comment