Cara Memasang CSS Anti Copy Paste di Blogger Tanpa JavaScript

Juli 24, 2026 Oleh Achmad Jauhari
Cara Memasang CSS Anti Copy Paste di Blogger Tanpa JavaScript


Salah satu masalah yang sering dialami oleh para blogger adalah konten yang disalin atau copy paste oleh orang lain tanpa mencantumkan sumber. Tentu hal ini sangat merugikan karena artikel yang dibuat dengan susah payah dapat dengan mudah dipublikasikan kembali di situs lain.

Meskipun tidak ada metode yang mampu mencegah pencurian konten secara 100%, Anda tetap bisa memberikan perlindungan tambahan agar pengunjung tidak mudah menyalin isi artikel. Salah satu cara yang paling ringan dan mudah diterapkan adalah dengan menggunakan kode CSS anti copy paste.

Metode ini tidak memerlukan JavaScript sehingga tidak akan membebani kecepatan loading blog. Selain itu, pemasangannya juga sangat mudah karena hanya perlu menambahkan beberapa baris kode CSS ke dalam template Blogger.

Perlu diketahui bahwa teknik ini hanya berfungsi untuk mempersulit proses penyalinan konten. Pengguna yang benar-benar paham masih memiliki berbagai cara untuk mengambil isi artikel. Namun, setidaknya cara ini cukup efektif untuk mencegah pengunjung biasa melakukan copy paste secara langsung.


Daftar Isi

Memuat daftar isi...


Kelebihan Menggunakan CSS Anti Copy Paste

Berikut beberapa keuntungan menggunakan metode ini:

  • Tidak memerlukan JavaScript.

  • Tidak memperlambat kecepatan loading blog.

  • Mudah dipasang pada semua tema Blogger.

  • Dapat mencegah pengunjung melakukan blok teks pada artikel.

  • Tetap menjaga tampilan blog tetap ringan dan responsif.

Konten yang Masih Bisa Disalin

Kode CSS ini sengaja memberikan pengecualian pada beberapa elemen tertentu, yaitu:

  • blockquote

  • pre

  • code

Ketiga elemen tersebut umumnya digunakan untuk menampilkan kutipan atau kode program. Oleh karena itu, pengunjung tetap dapat menyalin isi dari bagian tersebut agar tutorial yang Anda bagikan tetap mudah diikuti.

Cara Memasang CSS Anti Copy Paste di Blogger

Ikuti langkah-langkah berikut.

1. Login ke Blogger

Masuk ke akun Blogger Anda melalui dashboard Blogger seperti biasa.

2. Masuk ke Menu Tema

Pada menu sebelah kiri, pilih Tema, kemudian klik tombol Edit HTML.

3. Tambahkan Kode CSS

Letakkan kode berikut tepat di atas kode:

]]></b:skin>

Kemudian tambahkan kode berikut.

.post {
-webkit-touch-callout:none;
-webkit-user-select:none;
-khtml-user-select:none;
-ms-user-select:none;
-moz-user-select:none
}
.post blockquote,
.post pre,
.post code {
-webkit-touch-callout:text;
-webkit-user-select:text;
-khtml-user-select:text;
-ms-user-select:text;
-moz-user-select:text
}

4. Simpan Template

Setelah kode berhasil ditambahkan, klik tombol Simpan untuk menyimpan perubahan pada template Blogger Anda.

Cara Kerja Kode CSS

Kode di atas memanfaatkan properti user-select yang berfungsi untuk mengatur apakah sebuah teks dapat dipilih atau tidak.

Pada elemen .post, seluruh teks artikel dibuat tidak dapat dipilih sehingga pengunjung akan kesulitan melakukan blok teks dan copy paste.

Sementara itu, elemen blockquote, pre, dan code tetap diberikan izin untuk dipilih. Hal ini bertujuan agar pengunjung masih dapat menyalin kutipan maupun kode program yang memang perlu digunakan dalam tutorial.

Kelebihan dan Kekurangan

Kelebihan

  • Ringan karena hanya menggunakan CSS.

  • Mudah dipasang.

  • Tidak memerlukan script tambahan.

  • Tidak memengaruhi performa blog.

Kekurangan

  • Tidak dapat mencegah pencurian konten secara penuh.

  • Pengguna yang memahami Developer Tools masih dapat menyalin isi artikel.

  • Mesin pencari tetap dapat membaca konten seperti biasa.

Tips Tambahan Agar Konten Lebih Aman

Selain memasang CSS anti copy paste, Anda juga dapat melakukan beberapa langkah berikut:

  • Aktifkan HTTPS pada Blogger.

  • Pasang copyright di bagian footer.

  • Tambahkan internal link pada setiap artikel.

  • Gunakan canonical URL yang benar.

  • Daftarkan blog ke Google Search Console agar konten lebih cepat terindeks.

  • Laporkan situs yang mencuri artikel melalui formulir DMCA apabila diperlukan.

Penutup

Menggunakan CSS anti copy paste di Blogger merupakan salah satu cara sederhana untuk memberikan perlindungan tambahan terhadap artikel yang Anda publikasikan. Walaupun metode ini tidak mampu menghentikan pencurian konten secara sempurna, setidaknya dapat mengurangi praktik copy paste yang dilakukan oleh pengunjung biasa.

Apabila Anda menginginkan perlindungan yang lebih maksimal, Anda dapat mengombinasikan metode ini dengan JavaScript, watermark pada gambar, serta teknik SEO yang baik agar mesin pencari mengenali blog Anda sebagai sumber konten asli. Dengan demikian, kualitas dan keaslian artikel tetap terjaga serta lebih dipercaya oleh pengunjung maupun mesin pencari.

Bagikan:

Artikel Terkait