Pilih Bahasa
Indonesia
English
日本語 (Japan)
简体中文 (China)
한국어 (Korean)
हिन्दी (Hindi)
Tiếng Việt (Vietnam)
العربية (Arabic)
no fucking license

Cara Lindungi Konten Blog dari Copy Paste: Cara Blokir Seleksi Teks dengan CSS & Script

Lindungi Konten Blog dari Copy Paste
Lindungi Konten Blog dari Copy Paste

Bayangkan jika artikel yang kamu buat dengan susah payah justru dicopy paste orang lain tanpa izin. Kesal dan kecewa, bukan? Sayangnya, banyak yang langsung menyalin tulisan blog tanpa mengedit sedikit pun—hasilnya 100% sama dengan artikel aslinya. Dalam situasi seperti ini, opsi yang bisa kamu lakukan biasanya hanya melaporkan ke Google, berharap blog pelaku terkena penalti. Namun, jika itu tidak berhasil, artikel duplikat bisa tersebar di mana-mana tanpa kendali.

Agar hal ini tidak terjadi, kamu sebagai pemilik blog perlu meningkatkan keamanan konten. Kali ini, blog Egiagan akan membagikan trik sederhana untuk Cara Lindungi Konten Blog dari Copy Paste, terutama dengan kode CSS yang membuat teks tidak bisa diseleksi. Trik ini sangat mudah diterapkan dan bisa digunakan di berbagai platform, seperti Blogger, WordPress, dan lainnya.

Cara Blokir Seleksi Teks dengan CSS & Script

Berikut langkah-langkah untuk platform Blogger. Untuk platform lain, silakan pergi ke pengaturan CSS masing-masing.
  1. Masuk ke menu HTML
  2. Klik tombol Edit HTML
  3. Tekan CTRL + F bersamaan pada keyboard untuk memudahkan pencarian. Carilah kode CSS dari BODY.
  4. 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
    }
  5. 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 Ingin mencegah copy paste hanya di bagian tertentu? Coba gunakan kode berikut! ✨ Tapi, ada satu syarat kecil—kamu perlu sedikit memahami (sedikit saja, kok!) dan mengenali tag HTML.

Sebagai contoh, di sebagian besar template Blogspot, konten artikel biasanya berada dalam sebuah <div> dengan class .post-body. Jadi, jika kamu hanya ingin melindungi teks agar tidak bisa diseleksi di bagian ini saja, gunakan kode CSS berikut:

.post-body {
 user-select:none;
 -moz-user-select:none;
 -ms-user-select:none;
 -khtml-user-select:none;
 -webkit-user-select:none
}

Dalam CSS, 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

Sebaliknya, jika ingin mengaktifkan seleksi teks, gunakan kode berikut!  Kamu bisa menyimpannya di mana saja, tergantung pada ID atau class yang digunakan dalam template.

Sebagai contoh, jika ingin mengizinkan seleksi teks pada bagian Syntax Highlighter di Blogspot—yang biasanya menggunakan elemen <pre> dan <code>—maka kode CSS yang digunakan adalah:

.post-body pre code {
 user-select:text;
 -moz-user-select:text;
 -ms-user-select:text;
 -khtml-user-select:text;
 -webkit-user-select:text
}

Penutup

Mudah, kan? Cara di atas memungkinkan artikel postingan tidak bisa diseleksi hanya dengan CSS & Script. Sekarang, tinggal langsung dipraktikkan! Semoga trik ini bisa membantu mengurangi risiko copy paste di blog

Post a Comment

Tinggalkan komentar sesuai topik tulisan,dan Berkomentarlah dengan sopan, centang Beri Tahu Saya untuk mendapatkan notifikasi via email ketika komentar kamu di balas.
Masukkan URL Gambar atau Potongan Kode, atau Quote, lalu klik tombol yang kamu inginkan untuk di-parse. Salin hasil parse lalu paste ke kolom komentar.
  • Menulis kode gunakan kode (kode harus di-parse)
  • Menulis dalam syntax highlighter gunakan kode panjang (kode harus di-parse)
  • Menyisipkan gambar gunakan URL GAMBAR (ekstensi .jpg, .png, .gif, .webp, .ico)
  • Centang Beri Tahu Saya untuk mendapatkan notifikasi ke email saat ada yang membalas komentar.


image quote pre code