
Gimana perasaan kamu kalau artikel yang sudah dibuat susah payah akhirnya didupikat orang lain? Sakit hati dan kesel kan?! Nggak sedikit dari mereka yang sadis banget, yaitu copy paste tulisan blog tanpa dimodifikasi sedikitpun. 100% sama dengan artikel aslinya. Akhirnya kamu nggak bisa berbuat banyak selain melapor pada Google dan berharap blog sang pengcopy paste terkena penalti. Kalau hal itu nggak berhasil, ujungnya kamu hanya bisa merelakan artikel copy paste tersebut muncul dimana-mana. Makanya, kamu sebagai pembuat konten dituntut untuk lebih meningkatkan keamanan blog.
Kali ini blog Igniel akan berbagi trik sederhana yang sedikitnya bisa meningkatkan keamanan blog, khususnya dalam hal anti copy paste. Triknya sederhana banget, karena hanya berupa kode CSS. Ini bisa digunakan di semua platform seperti Blogger, Wordpress, dan lainnya. Kodenya untuk membuat tulisan blog tidak bisa diseleksi.
Cara Membuat Tulisan Tidak Bisa Diseleksi Agar Tidak Bisa Dicopy Paste
Berikut langkah-langkah untuk platform Blogger. Untuk platform lain, silakan pergi ke pengaturan CSS masing-masing.- Masuk ke menu HTML
- Klik tombol Edit HTML
- Tekan CTRL + F bersamaan pada keyboard untuk memudahkan pencarian. Carilah kode CSS dari
BODY
. - Kalau di dalamnya sudah ada kode CSS, JANGAN DIHAPUS! Tambahkan deretan kode berikut ke dalam CSS dari
BODY
tersebut. Sehingga hasil akhirnya kurang lebih jadi seperti ini.
BODY { user-select:none; -moz-user-select:none; -ms-user-select:none; -khtml-user-select:none; -webkit-user-select:none }
- Jangan lupa tekan tombol Save theme
Karena kodenya disimpan didalam
BODY
, maka setiap tulisan yang ada di blog bener-bener nggak bisa diseleksi semua. Jadi buat blog tutorial yang biasanya punya Syntax Highlighter agak nyebelin nih, karena kode dari blognya malah nggak bisa dicopy oleh pembaca.Kalau kamu mau membuat tulisan tidak bisa diseleksi pakai CSS HANYA di beberapa bagian, coba deh kode yang dibawah ini. Syaratnya, kamu harus sedikit paham (sedikit aja kok) dan ngerti tentang tag HTML. Misalnya gini. Di hampir semua template Blogspot yang beredar, isi artikel disimpan di dalam
div
yang memiliki class .post-body
. Maka kalau hanya ingin membuat tulisan tidak bisa diseleksi HANYA di area tersebut, kode CSSnya adalah:.post-body {
user-select:none;
-moz-user-select:none;
-ms-user-select:none;
-khtml-user-select:none;
-webkit-user-select:none
}
Dalam CSS,
Dan
Jika tag HTML dengan id
Kode CSSnya:
Jika tag HTML dengan class
Kode CSSnya:
id
diwakili oleh tanda pagar #
Dan
class
diwakili oleh titik .
Jika tag HTML dengan id
<div id="post-body">
Kode CSSnya:
#post-body
Jika tag HTML dengan class
<div class="post-body">
Kode CSSnya:
.post-body
Sedangkan kode dibawah ini untuk kebalikannya, yaitu mengaktifkan seleksi tulisan. Simpan dimanapun kamu mau, tergantung dari id dan class yang digunakan. Saya contohkan agar fitur seleksi aktif di bagian Syntax Highlighter Blogspot yang biasa menggunakan
pre
dan code
..post-body pre code {
user-select:text;
-moz-user-select:text;
-ms-user-select:text;
-khtml-user-select:text;
-webkit-user-select:text
}
Sederhana kan cara aga artikel postingan tidak bisa diseleksi dengan CSS diatas? Langsung praktekan ya. Semoga dengan ini sedikit menambah kemungkinan blog tidak bisa dicopy paste.
makasih mba igniel artikelnya membantu sekalii
BalasHapusini nih nanti saya coba dehh...ada beberapa artikel saya yang dicopas...nnanti pake jurus iini nihh...hheheh
mbak igniel, kalau untuk kode html yang dikotak itu bisa di copas gmn caranya? apakah pakai yang cara ke dua itu kah?
BalasHapusCara ketiga mas. Yang .post-body pre code
Hapusmbak, supaya gambar gak bisa di loading ketika di klik gmna ya mbak?
BalasHapuskeren teman saya akan coba nanti di blog saya ..
BalasHapusUntung Ada email langganan artikel buat copas, hehehe bercanda
BalasHapusPercuma kalo feed diset short. Cuma dapet 100-200 karakter pertama. Karakter loh bukan kata.
HapusSaya masih pemula jadi masih kurang paham..
BalasHapusSoalnya dengan menempatkan kode html yang terpotong potong itu sangat rumit..
Edit html juga di potong potong jadi bingung we
mbak cara biar beberpa kaliamat biar bisa di copy bagaimana ia?
BalasHapusblm ngerti saya.
cuman ngerti bagian kode pertama dan ke dua saja
Thanks mbak, saya pakai cara pertama. Work!
BalasHapuskadang ngerasa percuma masang karna di firefox ada mode reader view
BalasHapusTerimakasih mbak. Cara ini juga saya gunakan pada blog saya meski menggunakan WP cek bangnof.com
BalasHapusBODY {
BalasHapususer-select:none;
-moz-user-select:none;
-ms-user-select:none;
-khtml-user-select:none;
-webkit-user-select:none
}
Tapi kok saya otomatis ya kak.. Jadi syntax hilightnya normal ajah cuman text body doang yang gak bisa dicopy.. Padahal saya cuma nambahin code pertama doang, Lucky :V
How i contact with you?
HapusHahaha, gua bisa copy lu pake textbrowser😊
BalasHapusOh, kolo saya pakai violoncello
BalasHapus