How To Post Pictures On A Website That Cannot Be Copied

anwiii · April 11, 2010

the title pretty much explains my question. this isn't a tutorial on how to do it. i actually want to know HOW to do it. i have some interesting pictures. i know if i post them on my site, they are going to be copied so i want a way to post them without any way that someone can copy them. how does one do this?i want a secure way of protecting the pictures so please don't tell me to disable the right click button as any fool can bypass that.

rvalkass · April 11, 2010

There are two ways to look at this:

1. It's Impossible

Anything you place on the web, by definition, has to be downloaded to the user's PC before they can see it. They have therefore already been copied on to the user's computer, and from there they can do whatever they like with them.

2. You're Already Covered

Copyright law in most countries around the world already protects you. In most countries your work is under your copyright from the moment of it's creation, which means that people can't copy it in many ways (except under fair use). To enforce this you would need proof the work is originally yours, the date of its creation, the identity of the person copying it, and proof that what they're doing isn't covered by fair use.

If you are that desperate to stop people copying your work, consider whether you should actually be releasing it at all (in any form).

Rigaudon · April 11, 2010

There are two ways to look at this:

1. It's Impossible

Anything you place on the web, by definition, has to be downloaded to the user's PC before they can see it. They have therefore already been copied on to the user's computer, and from there they can do whatever they like with them.

2. You're Already Covered

Copyright law in most countries around the world already protects you. In most countries your work is under your copyright from the moment of it's creation, which means that people can't copy it in many ways (except under fair use). To enforce this you would need proof the work is originally yours, the date of its creation, the identity of the person copying it, and proof that what they're doing isn't covered by fair use.

If you are that desperate to stop people copying your work, consider whether you should actually be releasing it at all (in any form).

It's true that you must download a picture before you can view it, but most people don't know how to find it. To prevent them from copying the picture by right-clicking, you just need a simple script, and I think you'll find that it will stop the majority of people who visit your website from stealing it, as most people who browse the internet today aren't geeks (~60% still use IE... *barfs).

Anyways, do this:

<body oncontextmenu="return false;">

This will disable right click for your entire page.

Good luck on... not getting your pictures stolen O_o

truefusion · April 11, 2010

I wouldn't call it entirely impossible, since i've seen a website prevent images from being saved onto the computer (i.e. "Save Image As"). I am not exactly sure how they did it, but whenever i tried to save the image to my computer, i would end up downloading an HTML page instead. I'm sure you can tell the browser not to cache the image too. The website, however, i do not remember, but copying and pasting the image into an image editor would have been the obvious way around it. But if you're going to embed the image in an HTML page, use JavaScript to load the image and prevent right-clicking on image elements. That way, if they disable JavaScript, the image won't be shown.Perhaps you can use an .htaccess file to prevent access to a directory where the image is in (most likely the directory would be called "images"), so whenever someone tries to access the file directly they would be denied. Loading the image, then, in an HTML page may be tricky and may require some server-side scripting.

Rigaudon · April 11, 2010

Well, in any case, if the user can SEE the image, regardless of whether they can access it or not, they can always take a screenshot of it and crop it out.

web_designer · April 11, 2010

you can use this code for java script, that disable right click on your page but allows copying text by CTRL+C. so if you don't want to avoid everything from being copied. use this code and add that your visitor can copy text by using ctrl+c in the alert message (var message="Function Disabled!" , or you can change it to whatever you want. you can put it after BODY tag in your page

<script language=JavaScript><!--//Disable right mouse click Script//By Maximus (maximus@nsimail.com) w/ mods by DynamicDrive//For full source code, visit dynamicdrive.com/var/ message="Function Disabled!";///////////////////////////////////function clickIE4(){if (event.button==2){alert(message);return false;}}function clickNS4(e){if (document.layers||document.getElementById&&!document.all){if (e.which==2||e.which==3){alert(message);return false;}}}if (document.layers){document.captureEvents(Event.MOUSEDOWN);document.onmousedown=clickNS4;}else if (document.all&&!document.getElementById){document.onmousedown=clickIE4;}document.oncontextmenu=new Function("alert(message);return false")// --> </script>

also, you can always add a water mark to your images by any graphic program, or set a transperancy by CSS, for example you can make your image looks by default transparent, but when pass the mouse over it it will show without transparency, i did that to my social bookmarks in my website, you can take a look on them, and i will show you how. or you can check this link, i found it by accident when i was searching the net http://forums.xisto.com/no_longer_exists/ good luck.

Rigaudon · April 11, 2010

Hahaha, I love how we're all posting codes on how to disable right click when he clearly said that he didn't want that in his post. As for me, that's what I get for staying up all night soft resetting Pokemon Emerald trying to get a shiny Treecko. Well, as I can't find any edit button, let's just say I posted it to annoy anwii .

kleong · April 11, 2010

Yep, as mentioned, there is practically no way you have prevent others from taking it. You can disable the right click function and such. But what one could be is to take a screen capture, with the help of photoshop, they will still be able to get the image. One possible deterring way would be to put your website as a watermark. In that case, even thou they are able to grab it, at least, they wont be able to grab a perfect version.

anwiii · April 11, 2010

correctamundo! haha just to annoy me huh? i saw that message in the shoutbox haha

but yea, any monkey can get past the right click disable. i was thinking more of flash or something? some other format that would protect the pictures. or maybe a combination of things i can do so it's not so easy. of course right click would enter in to that formula but i don't trust it alone....

the pictures are images i took from a graveyard one day when i visited with two other people. they aren't edited and some of the best captures i ever took. that's why i need them protected. also, yes, i want to post them and it's worth the risk of them being stolen.

Hahaha, I love how we're all posting codes on how to disable right click when he clearly said that he didn't want that in his post.
As for me, that's what I get for staying up all night soft resetting Pokemon Emerald trying to get a shiny Treecko.

Well, as I can't find any edit button, let's just say I posted it to annoy anwii .

rvalkass · April 12, 2010

the pictures are images i took from a graveyard one day when i visited with two other people. they aren't edited and some of the best captures i ever took. that's why i need them protected. also, yes, i want to post them and it's worth the risk of them being stolen.

Some form of watermarking is probably your best bet then. Put your name/URL/whatever somewhere centrally in the image. Do it fairly small and in a way that 'blends in' with the background (ie. not 72px bold red text). This doesn't directly stop people copying, but it makes it obvious if they do - and you still get credit. Unfortunately you'd have to place the watermark in the centre to avoid people cropping the images to cut off your watermark.

If you're intending to use the images for commercial purposes (ie. selling the rights to them or selling prints of them) then you can just put low-quality versions online (either very compressed JPEGs, or just small sizes) so that they are useless for commercial purposes, but people still get an idea of the image and whether they want to pay.

It also depends on how far you want to go i protecting the images, and who you're trying to deter. If you set the images as the background for a DIV element using CSS, you can't copy the image with right clicking in most browsers. You can go further by placing a DIV over the image of exactly the same size, with its background set to a repeated 1px square that is a transparent PNG or GIF. The image is still viewable in the browser, and right clicking and selecting "View Background Image" just presents the user with a 1px transparent square rather than your image. Of course, looking through the CSS reveals the actual path to the image. And nothing can stop people pushing the "Print Screen" button on their keyboard

mahesh2k · April 12, 2010

If you're intending to use the images for commercial purposes (ie. selling the rights to them or selling prints of them) then you can just put low-quality versions online (either very compressed JPEGs, or just small sizes)

Some stock image sites use watermark(getty images) on displayed images and only person with buying rights can get image without watermark. Not sure how this is done at the same time while making purchase. I'm also curious about profile images rendered on social networks like orkut. You can't right click and save them even if they allow context menu for you to do. You'll end up saving blank image of one dot. I don't know which trick they used. Flash images can also be extracted as there are softwares that lets you do that. Music, images and content can be extracted from flash files. Those who are interested in doing that will know where to find it. But using flash will definitely help files protect from typical noob plagiarists or from people who use files/pics of others without giving credit.

A year before i came across website that restricts people from copying website from HTTtracker, restricted context menu and used JS for images and restricted on most typical ways to copy the site and the stuff inside it. Not sure how they did that.

web_designer · April 18, 2010

hi, anwiii. take a look on these links.

http://forums.xisto.com/no_longer_exists/
http://forums.xisto.com/no_longer_exists/

these links contain ajax scripts for images viewer. and not allowed save as image option, hope it will work for you.

Soviet Rathe · April 19, 2010

k, there is absolutely no way to keep someone from copying any part of a website, but you can make it harder you can use CSS or PHP to show the picture but not be able to simply right-click and save it, I'm not sure how to do this but for the normal user they would not be able to simply save the picture, but with someone who it a bit more advanced they can grab it from their cache.

shadowx · April 19, 2010

ou can use this code for java script, that disable right click on your page but allows copying text by CTRL+C. so if you don't want to avoid everything from being copied. use this code and add that your visitor can copy text by using ctrl+c in the alert message (var message="Function Disabled!", or you can change it to whatever you want. you can put it after BODY tag in your page

That code doesnt work, it listens for a mouse event that equals "2" which is indeed right click, however, left click is "1" so pressing both buttons at once = "3" and since 3 != 2 the script ignores it and i get right click.

You just cant protect these images other than watermarking. Screen shots will always get them. The only way to block that is to detect the print screen keypress and instantly change the picture to the most horrific thing you can find on google for a split second so they get some horrible image, but the likelihood of this working is about 1% assuming it is even possible.

Rigaudon · April 21, 2010

I've got it!

1) Use a java applet to get the picture. They won't be able to see where the picture is and can only get the class, which shows no source code. Here's a simple java app script:

import java.applet.*; import java.awt.*; 			 public class appletImage extends Applet{  Image img;  MediaTracker tr;  public void paint(Graphics g) {	tr = new MediaTracker(this);	img = getImage(getCodeBase(), "freelinuxcds.gif");	tr.addImage(img,0);	g.drawImage(img, 0, 0, this);  } }

Change the image src in the code as necessary.
To put this on your site, copy the code, compile it, and store the class in the same folder. Add this where you want the image:

<applet code="appletImage.class" height="500" width="500">

2) Make it impossible to take a screenshot of it by overriding the clipboard when they press any key- Unfortunately, it only works for IE, but it's something.

document.onkeydown=copy;function copy() {var text2copy = "NO";  if (window.clipboardData) {	window.clipboardData.setData("Text",text2copy);  } else {	var flashcopier = 'flashcopier';	if(!document.getElementById(flashcopier)) {	  var divholder = document.createElement('div');	  divholder.id = flashcopier;	  document.body.appendChild(divholder);	}	document.getElementById(flashcopier).innerHTML = '';	var divinfo = '<embed src="_clipboard.swf" FlashVars="clipboard='+escape(text2copy)+'" width="0" height="0" type="application/x-shockwave-flash"></embed>';	document.getElementById(flashcopier).innerHTML = divinfo;  }}

3) Just for extra safety, disable right-click.

This should cover about 99% of normal internet users. Hope this helps!

Sign In

How To Post Pictures On A Website That Cannot Be Copied

Recommended Posts

Share this post

Link to post

Share on other sites

Share this post

Link to post

Share on other sites

Share this post

Link to post

Share on other sites

Share this post

Link to post

Share on other sites

Share this post

Link to post

Share on other sites

Share this post

Link to post

Share on other sites

Share this post

Link to post

Share on other sites

Share this post

Link to post

Share on other sites

Share this post

Link to post

Share on other sites

Share this post

Link to post

Share on other sites

Share this post

Link to post

Share on other sites

Share this post

Link to post

Share on other sites

Share this post

Link to post

Share on other sites

Share this post

Link to post

Share on other sites

Share this post

Link to post

Share on other sites

Create an account or sign in to comment

Create an account

Sign in

Important Information