Cara Memasang Script Anti-Copy di Blogspot (Lengkap + Script CDATA)

Panduan langkah-demi-langkah agar Anda bisa melindungi konten dari copy/paste dan inspeksi sederhana, tetapi tetap menjaga form, link, dan tombol berfungsi.

Apa yang dilakukan script ini?

Script anti-copy yang disediakan akan:

Menonaktifkan klik kanan pada halaman.
Mencegah pemilihan (select) teks dan drag gambar (pada sebagian besar browser).
Memblok beberapa shortcut umum seperti Ctrl+U, Ctrl+S, Ctrl+Shift+I, dan F12.
Mengizinkan tombol, link, form, input, dan textarea tetap berfungsi agar user masih bisa berinteraksi normal.

Catatan penting: Tidak ada cara 100% aman untuk mencegah penyalinan (pengguna berpengalaman tetap bisa mengambil konten lewat sumber server, screenshot, atau crawler). Gunakan fitur ini untuk mencegah penyalinan cepat oleh pengguna biasa — bukan sebagai pengaman absolut.

Persiapan: di mana menaruh script?

Di postingan tertentu — buka editor posting, pindah ke tab HTML, lalu paste script di posisi atas atau bawah isi posting.
Di semua halaman (global) — buka Theme » Edit HTML dan tempelkan script sebelum tag </body> di template.

Script utama (versi aman & fungsional) — cocok untuk Blogger (pakai CDATA)

Script ini mencegah tindakan salin & inspect sederhana, tetapi membiarkan form dan link tetap bekerja.

Klik untuk menyalin

 
<!-- Pasang ini di HTML posting (HTML mode) atau sebelum </body> di template -->
<script type="text/javascript">
//<![CDATA[
(function(){
  // Nonaktifkan klik kanan
  document.addEventListener('contextmenu', function(e){
    e.preventDefault();
  }, false);

  // Cegah drag (gambar/teks)
  document.addEventListener('dragstart', function(e){
    e.preventDefault();
  }, false);

  // Cegah selectstart (blok teks)
  document.addEventListener('selectstart', function(e){
    // biarkan jika pelaku berasal dari elemen input supaya form tetap bisa dipilih
    var t = e.target;
    if (t && (t.tagName === 'INPUT' || t.tagName === 'TEXTAREA' || t.isContentEditable)) return;
    e.preventDefault();
  }, false);

  // Blok kombinasi tombol umum (Ctrl+U, Ctrl+S, Ctrl+Shift+I, F12)
  document.addEventListener('keydown', function(e){
    // normalisasi key
    var key = e.key || e.keyCode;
    var isCtrl = e.ctrlKey || e.metaKey; // ctrl di Windows, meta di mac
    var isShift = e.shiftKey;

    // key checks (beberapa browser memberi string, beberapa memberi kode)
    if ( (isCtrl && (key === 'u' || key === 'U' || key === 85)) ||
         (isCtrl && (key === 's' || key === 'S' || key === 83)) ||
         (isCtrl && isShift && (key === 'I' || key === 'i' || key === 73)) ||
         (key === 'F12' || key === 123) ) {
      e.preventDefault();
      // opsional: tampilkan pesan singkat (hapus alert jika tidak mau pop-up)
      // alert('Fungsi ini dinonaktifkan.');
    }
  }, false);

  // Pastikan tombol, input, textarea, select, dan link masih bisa diklik/ditangani
  var interactive = ['button','input','textarea','select','a','label'];
  interactive.forEach(function(tag){
    var els = document.getElementsByTagName(tag);
    for (var i=0;i<els.length;i++){
      (function(el){
        el.addEventListener('mousedown', function(ev){ ev.stopPropagation(); }, true);
      })(els[i]);
    }
  });

  // tambahan CSS untuk mencegah seleksi pada elemen non-form
  var style = document.createElement('style');
  style.type = 'text/css';
  style.appendChild(document.createTextNode('body, article, p, div { -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } input, textarea, select { user-select: text !important; }'));
  document.head.appendChild(style);
})();
 //]]>
</script>

Versi ringan (hanya klik kanan + seleksi)

Jika Anda ingin lebih ringan tanpa memblok shortcut keyboard, pakai ini:

 
<script type="text/javascript">
//<![CDATA[
document.addEventListener('contextmenu', e => e.preventDefault());
document.addEventListener('selectstart', function(e){
  if (e.target.tagName === 'INPUT' || e.target.tagName === 'TEXTAREA' || e.target.isContentEditable) return;
  e.preventDefault();
});
//]]>
</script>

Langkah pemasangan di Blogger (detail)

A. Pasang untuk satu posting

Buka dashboard Blogger → New Post atau Edit Post.
Pindah ke HTML view (bukan Compose).
Paste kode <script>...</script> di bagian paling atas atau bawah konten.
Publish / Update.

B. Pasang global (semua halaman)

Dashboard → Theme → klik tanda panah pada tombol Customize → Edit HTML.
Cari tag </body> (gunakan Ctrl+F).
Paste script (tag <script> dengan CDATA) sebelum </body> lalu Simpan.

Perhatian & Best Practices

UX & aksesibilitas: Hindari memblokir keyboard bagi pengguna yang membutuhkan (misal screen reader). Script disarankan jangan memblokir seluruh keydown global. Versi yang saya berikan menargetkan kombinasi developer tools saja.
SEO & bots: Script ini tidak menghalangi search engine crawler—crawler mengambil sumber HTML dari server. Jika konten sangat sensitif, pertimbangkan hak cipta formal dan watermark.
Penguji: Setelah pemasangan, uji di browser Chrome, Firefox, dan mobile. Beberapa fitur (mis. seleksi) mungkin bekerja berbeda antar browser.
Hindari alert berlebihan: Alert sering mengganggu pengalaman. Jika mau notifikasi, gunakan toast kecil atau tidak sama sekali.

Jika mau disesuaikan

Saya bisa modifikasi lagi nanti pada artikel berikutnya:

Membuat versi aktif hanya pada halaman posting tertentu (cek URL).
menambahkan pesan atau toast saat pengguna mencoba klik kanan.
Menonaktifkan script untuk user login (mis. admin) agar kita yang punya blog sendiri tetap bisa kontrol.

Silahkan ditunggu artikel selanjutnya,dimana saya akan buatkan versi langsung yang sudah disisipkan ke template Blogspot.

Lihat kode script

Tutorial Cara pasang script anti copy di blogspot terbaru