How can i make my post unselectable to prevent copy and paste on my Website - Technology | Business tips

I feel the pain when you spend day and night writing articles, and then from nowhere your articles have been copied by just highlighting the whole text and then, copy and paste. Many users even copy your content without even modifying it a little, and then it just looks 100% the same as the original, really annoying right? The only thing you could have done is to report this to Google and then keep hoping they will penalize them. And if that doesn't work, it's either you let them keep copying and pasting everywhere, or you improve your blog security.

Anyways, I'll be teaching you how to increase the security of your blog, especially with the copy and paste of a thing. This trick is very easy to use, and you can use it on blogger, WordPress, and others because it uses pure CSS.

So how do I make text not selectable for copy and paste?

This steps I'll be taking shorty are for Blogger users, for other users like WordPress, please go to their respective CSS settings.

Step1) Go to your blogger control panel, go to your theme settings, and edit HTML. Look for the CSS code from BODY,  Press the CTRL + F for PC users for easy searching, and if you using mobile phones, look for it manually.

Step2) if you find any CSS code there, don't bother to REMOVE! Add the following line of code into the CSS from the BODY. The final result would look like this code below.

BODY { user-select:none; -moz-user-select:none; -ms-user-select:none; -khtml-user-select:none; -webkit-user-select:none }

After that, now save your settings by clicking the save theme button. Now that the code is being saved inside the BODY, every article on your blog won't be able to be selected at all.

Note: For those bloggers who show tutorials on their blog, just like this very one your reading, using this code will make all the text on your blog unselectable, and even the code you share won't be able to get copied by your user.

If you only want to make the text on your blog/website that can't be selected using CSS only in some part of your blog/website, then use the code below. But be careful, you really have to understand HTML tags. For example, almost all the blogger templates in circulation, the content of the articles are stored in diva class .post-body. So if you only want to make the text unselected only in the area, the CSS code is below. 

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

id represent by a pound sign # and is class represented by a dot.
While the code shown below is for the opposite, which can be used to activate the text selection. Save it to wherever you want, depending id and the class that is used. I demonstrated so that the selected feature is active in the Syntax Highlighter Blogspot section that usually uses pre and code.

 

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

And yeah, we are done. Don't forget to comment and share it with a friend.

Related Posts