How To Disable Copy Paste In Blogger and WordPress Without Plugin?

Disclosure: Some of the links to products in this article are affiliate links. It simply means, at no additional cost to you, we’ll earn a commission if you click through and buy any product.

This is the step-by-step tutorial to Disable Copy Paste in Blogger and WordPress without plugins. Here I have shared 3 (2 CSS & 1 JavaScript) different codes to protect website content by disabling text selection in your website. If anyone doesn’t work try the other one.

#1. How To Disable Copy In Blogger Using CSS?

Step 1: Log in to your Blogger Dashboard > Take a Backup
Step 2: Navigate to Theme > Customize > Advanced > Add CSS > Paste any of the below code > Save

or Paste it just before ]]></b:skin> in by going to Edit HTML

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; 
}

That’s all

Instead of using this many lines, you can also use only the last line user-select: none; but each of the codes has its own features that work in different browsers. You can read more about User-Select.

#2. How To Disable Copy In Blogger Using JavaScript?

Step 1: Log in to your Blogger Dashboard > Take a Backup
Step 2: Navigate to Theme > Edit HTML > Paste Below JavsScript code just before </body> > Save

<script>
$(&#39;body&#39;).bind(&#39;copy cut drag drop&#39;, function (e) { e.preventDefault(); });
</script>

That’s all

Note: A normal guy won’t be able to select if you are blocking selection with this JavaScript code, but it can be selected by disabling JavaScript for that site. So I advise you to use CSS.

How To Disable Copy In WordPress Website Without Plugin?

Step 1: Log in to your WordPress Dashboard
Step 2: Navigate to Appearance > Customize > Additional CSS > Paste any of the below Code > Publish

Body {
  user-select:none;
}

or

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

That’s all

How To Enable Selection To Some Parts Of The Website?

These CSS codes will block selection in the whole website, but if you want to enable it for some parts then it can be enabled easily. For example, I want to enable selection for <code> & <pre> so we have to paste this you can change the class according to your need.

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

For tags like “Code, Pre, blockquote” I recommend you to replace text with all in the above code. Replacing with all will select the whole text available in these tags.

Wrap Up

I’m assuming that this article would be useful for you to disable copy paste on blogger and WordPress without plugins with the help of simple CSS codes. If this article is useful for you then make sure to share it on social media and let me know your feedback in the comment below.

Happy Bloging!