Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

HTML

Posted by Konstantin Nikkari
Konstantin Nikkari
5,185 Points

Remove the possibility of copying website paragraphs.

Hello,

I made a site to one of my clients and they would like to have the website so that no-one can copy-paste the texts that the site have.

Is there a way or a method that I could use to remove the possibility of copying (cmd+c) website paragraphs but still keep it SEO friendly etc?

Putting the text in jpg files is not an option.

Thanks!

2 Answers

Igor Yamshchykov
Igor Yamshchykov
24,397 Points

This code might work, but basically, any advanced user would still be able to copy text from your site. 

<body oncopy="return false" oncut="return false" onpaste="return false">

or disable selecting by CSS as well

.noselect {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

and html to work with that css

<p class="noselect">
  Unselectable text.
</p>
Konstantin Nikkari
Konstantin Nikkari
5,185 Points

Great! I'll try this ASAP. Will this also prevent mobile devices eg. ios, android, windows of selecting the text by holding your finger over the text?

Samuel Webb
Samuel Webb
25,370 Points

Clients are so funny. If someone really wants the text they could just open a notepad and write it all down. I guess the clients intent is to make it harder for them. Sadly, people are able to disable CSS and JavaScript so these attempts will work against someone who doesn't know that, but they'd still be able to get it if they really had the know how.

Honestly, I'd try the above Ihor's method and see if the client is satisfied with that.

Igor Yamshchykov
Igor Yamshchykov
24,397 Points

I'm not sure about mobile devices, but i think I should actually prevent selecting.

Konstantin Nikkari
Konstantin Nikkari
5,185 Points

Thanks for the help. Both of these method work in desktop and in mobile environment. I decided to put the body line and the noselect class in my wrapper

<body oncopy="return false" oncut="return false" onpaste="return false">

<div id="wrapper" class="noselect">
Shane Meikle
Shane Meikle
13,188 Points

That only prevents the novice users from not being able to do it the easiest way. It is still very easy to open the page source and copy it from there.

The only real protection you have is through copyright.

Konstantin Nikkari
Konstantin Nikkari
5,185 Points

Thanks Shane. I do know about the possibility of opening the source code. But my client's competitors do not know so to them this is a site where you can't copy. And this is fine for my client.

Copyright, well... I guess you could apply for patent as well. Honestly there is no such thing as 100% protection from copying. People copy each other. This is how we develop.

Shane Meikle
Shane Meikle
13,188 Points
Shane Meikle
Shane Meikle
13,188 Points

If it is on the web, anyone can get to it. For example, a simply bypass to almost all attempts would be to simply view the source of the code (which all browsers allow) and then copy/paste the content that appear between the P tags.

The options you have are to make it not worth their time/effort to retrieve the content. In this instance, the option would be to convert all text to images (basically, write out the paragraphs in something like Word and then get a screen capture) and use the img tags to place the P images. Not foolproof, but does make things more of a time waster than the person may want.

Downsides to doing such things may be worse than just leaving it alone, however. As in the example above, images take up much more bandwidth than text does. Some people even have images disabled on their browsers, and then would make the site worthless.

Igor Yamshchykov
Igor Yamshchykov
24,397 Points

This method could also impact the performance. I suppose in order to make hard time for people to copy something from html is better to minimize html probably.

Shane Meikle
Shane Meikle
13,188 Points

Nope. Anyone who is determined to copy content will be able to easily get to it, minimized or not. For example, take this page and open the source. There is a lot of content within. Now, hit the search function (windows will be ctrl+f). Type in a few words from my response here. Boom...content found, all they now have to do is highlight and then copy/paste. All that work spent trying to keep it from happening was just crushed in two seconds.

Bottom line is the OP's client needs to get a better grasp on the fact that if it is on the Internet, people can and(if it is worth doing) will get it. On the other hand, if the OP's client refuses to accept that upfront, the OP can get some good billable hours showing them otherwise.