Hi,

 

I'm trying to protect the images on a site i'm currently building from people downloading them.

I've read about 'shrink-wrapping' them by inserting the original image into a div and then placing a div on top with a transparent image inside thereby, when a viewer tries to download the image, they end up saving the transparent image instead.

 

The problem is i am using the NextGen Gallery for wordpress plugin and i can't go through inserting div's for every image.

Does anyone know of a CSS technique or perhaps an easy way i can implement this into the NextGen Gallery?

 

Any help would be much appreciated!

 

Many thanks,

-Jack

I'd be interested in this too please

IMHO, it's impossible to protect any image published on web page from downloading.

I'd be interested in this too please

 

Unfortunately there is no foolproof method, probably the best way is to look at the way stock photo sites protect there images as they have a lot to lose if there methods arent great.

You could use a PHP generated PNG as well as a div overlay. If a user goes to view->source to bypass the blank image to obtain the file path, the image would be: image.php?id=92458 for example.

 

image.php would then specify that the image is to only be displayed within the website, else it displays an error image.

 

This would prevent most of the possible ways to download an image without watermarking. The only thing that nothing can prevent is taking a screen shot. You can disable the print screen button in Javascript, but the user only has to disable Javascript to get around that.

I agree entirely. It is a tricky thing but I promised I'd look into it for a client. There's a few wordpress plug-ins I've found and I'll let you know if I find anything good.

 

I know people are sneaky but what is the most popular way of deterring people from downloading images?

All of what I mentioned + watermarks. The only real deterrent is to make them work for it!

True. What about layering a transparent image over all images using a CSS class? Is that possible?

You could just use the style attribute in the IMG tags. i.e.

 

<img style="background-image:url(image.jpg)" src="blank.gif" width="150" height="150" />

All images from online are stored in browser cache on your hard disk.

Please, if I am asking about CSS classs then it is fairly obvious that I know how a browser works! Your answer was also totally irrelevant and was not a reply to my original question. Try and keep it logical in future or provide an answer that is useful to all members of the forum.

 

-Jack

i wouldn't bother tbh. sad i know, but it's more hassle than it's worth. if they are commercial images, watermark them. if they are part of a site, sadly if someone wants em they will get nicked. next best thing you can do is name and shame, or go to an ip lawyer

You could just use the style attribute in the IMG tags. i.e.

 

<img style="background-image:url(image.jpg)" src="blank.gif" width="150" height="150" />

 

What if i wanted to use classes though? It would be next to impossible to do this method without changing the attributes of every image on the site. It's got gallery after gallery of images and isn't a viable solution for larger sites. Sites with one or two images, sure...

Please, if I am asking about CSS classs then it is fairly obvious that I know how a browser works! Your answer was also totally irrelevant and was not a reply to my original question. Try and keep it logical in future or provide an answer that is useful to all members of the forum.

 

-Jack

 

 

IMHO, it's impossible to protect any image published on web page from downloading.

because

All images from online are stored in browser cache on your hard disk.

Sincerely,

Lev

because

 

Sincerely,

Lev

 

Again, this is all basic stuff. The point is to be a deterrent to people that want to download it and hope that they move on. Anyone that wants images just has to browse to a site and there they are, sitting in the browser cache, no right clicking, no special software to strip a website of it's images or anything. Just there, perfectly well, already downloaded in the browser cache.

 

My question asked for a method of deterrent, not some answer that attempts to make others feel stupid.

Either provide a reasonable suggestion or don't bother contributing to the conversation.

Ok ok - a few things...

 

1. @Jack - please calm down buddy - Lev is a good forum member and has provided a reasonable reason WHY you can't protect images with just css.

 

2. This thread has been answered already, basically NO, you can't protect images using just css. If someone wants an image, they will get it. As long as you have a print-screen function, or a screen grabber software, you will always be able to steal images. Either watermark them, or live with the consequences.

 

To cut a long story short, it is IMPOSSIBLE to stop people stealing images. If they can see them, they can steal them. Simple...

 

Now lets all play nice

Oh my!

 

It's not that I am getting wound up or anything of the sort!

 

I for one do not appreciate being treated like a simpleton by a forum regular. I didn't ask to stop people from stealing images altogether, this I already know, it was to ask for a deterrent! You have just answered the question, once again that I did not ask! My beef, is with people that do not read the question and then presume they are some sort of guru on an irrelevant subject. It is clear it cannot be done with CSS alone now. There doesn't seem to be an easy way or deterring people. This I will bow relay back to my client.

 

I wish, before replying, people would read the question, keep it relevant and stay polite.

I did not want to make you feel stupid, mate.

I only tried to help you to avoid useless efforts to protect images from downloading. To obtain any image placed on the page there is no need any special sofware. Because simple FireFox is enough. Use standard feature Tools-> Page Info-> Media. That's all.

Sorry for disturbing you. I did not mean to offend you.

Henceforth I will not even look at this thread.

Good luck!

I did not want to make you feel stupid, mate.

I only tried to help you to avoid useless efforts to protect images from downloading. To obtain any image placed on the page there is no need any special sofware. Because simple FireFox is enough. Use standard feature Tools-> Page Info-> Media. That's all.

Sorry for disturbing you. I did not mean to offend you.

Henceforth I will not even look at this thread.

Good luck!

 

Thank you, i appreciate that. Courtesy and forum etiquette goes a long way.

Hi Jack,

 

Shaun gave you the method to do this - but as far as I am aware, there is no way of automating the process with css alone.

 

Would using some javascript be an option? I know people could just turn JS off, but if they had it enabled, you could write a small script that said something like:

 

if user right clicks on an image

>

then do the following:

 

1. Save the image source as a variable

2. Set the image source to blank.gif

3. Set the image style to: background $source_variable, height 150 and width 150

 

 

Now I am no JS guru by any means, but in my head, that should work as a slight deterrent - but it always comes back to the same thing, with the amount of screen-grabbers etc... out there, people will always find a way

I disapprove of the lack of +1's I've been getting lately. Instead, just a lot more questions! lol

 

Jack, the method I gave you would work. If it was me, I would just make the gallery dynamic so you don't need to go and edit every image tag (even though making a class would still mean having to edit every tag, anyway).

 

If you don't want to bother with CSS anymore, terydinho's JS idea would work just as well, or even just watermarking.

I disapprove of the lack of +1's I've been getting lately. Instead, just a lot more questions! lol

 

Jack, the method I gave you would work. If it was me, I would just make the gallery dynamic so you don't need to go and edit every image tag (even though making a class would still mean having to edit every tag, anyway).

 

If you don't want to bother with CSS anymore, terydinho's JS idea would work just as well, or even just watermarking.

 

Thank you, i'll look into it all

 

-Jack