If you want to protect your website content from being copied, this step-by-step guide will help you disable copy functionality in both Blogger and WordPress without using any plugins. I’ve included two CSS methods and one JavaScript method, if one doesn’t work, try another.

Method 1: Disable Copy in Blogger Using CSS

Step 1: Log in to your Blogger Dashboard
Step 2: Take a full backup of your theme
Step 3: Navigate to Theme > Customize > Advanced > Add CSS
Step 4: Paste any of the below CSS codes and click Save

Or, you can add the CSS directly in the HTML by going to: Theme > Edit HTML, and pasting it just before ]]></b:skin> 

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

or 

p, li, h1, h2, h3, h4, h5, h6 {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

Using only user-select: none; may work, but including browser-specific prefixes ensures better compatibility across all major browsers. Read more about User-Select.

Method 2: Disable Copy in Blogger Using JavaScript

Step 1: Go to Blogger Dashboard > Theme > Edit HTML
Step 2: Scroll down to just before </body> and paste this code:

<script>
document.body.addEventListener('copy', function(e) { e.preventDefault(); });
document.body.addEventListener('cut', function(e) { e.preventDefault(); });
document.body.addEventListener('dragstart', function(e) { e.preventDefault(); });
document.body.addEventListener('drop', function(e) { e.preventDefault(); });
</script>

Note: This method depends on JavaScript. Users can bypass it by disabling JavaScript, so CSS method is more reliable.

Disable Copy in WordPress Without Plugin

Step 1: Log in to your WordPress Dashboard
Step 2: Go to Appearance > Customize > Additional CSS
Step 3: Paste one of the following codes and click Publish:

body {
  user-select: none;
}

or

p, li, h1, h2, h3, h4, h5, h6 {
  user-select: none;
}

Enable Copy on Some Specific Parts

If you want to allow selection only for certain areas (e.g., <code>, <pre>, <blockquote> tag), use the following code:

code, pre {
  -webkit-user-select: text !important;
  -moz-user-select: text !important;
  -ms-user-select: text !important;
  user-select: text !important;
}

Replace text with all if you want to allow full-text selection on those tags.

Wrap Up

That’s how you can disable copy on Blogger and WordPress using just CSS or JavaScript. It’s a simple trick that can help protect your content from basic content theft.

Similar Posts