This question already has answers here:
Closed 10 years ago.
We have a picture on Our website how can i prevent other users cant download this picture ?
is it possible or not ? if its not possible please give some ways to make harder the way of copy a picture
If you really want to prevent someone from stealing a picture, someone refer to someone that is bad with technology, here's some technic :
Place the image as CSS background instead
Put a transparent DIV over the image.
Disable right click
Watermark all your image
Disable direct image access
Use .htaccess to allow only your website to access your image
Embed the picture using flash or something similar
Consider this : what is on the Internet will be and always be "free" to every "thief".
EDIT Here's a technic used to convert torrent inside a PNG : http://stegtorrent.sourceforge.net/ You could do the reverse if your the FBI ! :) Store your image inside a diffrent type of file.
The user can copy it one way or another. One interesting way though is to use images as CSS background that makes it it a little harder than right click and save image.
<div style="background-image:theimage.png ;"></div>
But to the determined user there is not much you can do. when you share an image just assume someone will copy it. Otherwise don't share it.
Add this script to the body tag. This will disable the right click from which save is called.
Have a look at this post on stack overflow Disable mouse click outside cropped region
Related
I have a portfolio site that I used in p5.js, and this ad appears above me. Is there an option to cancel it?
the way is solved this was by hosting the p5 code on my website. This removes the banner completely. However if you want to have more than 1 canvas you should take a look at the link below. To position each canvas where you want use the id selector in css to position it.
https://editor.p5js.org/caminofarol/sketches/r609C2cs
I hope this answers your question.
This is not an "ad", but a banner meant to clearly identify the page as being something hosted on p5js.org. As I mentioned in this answer
A change was recently made to p5js.org that eliminates the banner-less full screen preview of a p5.js sketch created with editor.p5js.org. This change was made because somebody was abusing the site to phish credentials.
For the time being you can still use https://openprocessing.org/ to host sketches such that you can embed them with no banner (however there's no guarantee this won't change in the future). If you want full control of how your sketches look when you embed them on another page I suggest you host the content of your sketch on your own server.
I am trying to replace the image at http://imgur.com/a/IHwaC (wont let me upload it to here for some reason) with another image but whenever I do it it just seems to make the background white and not actually do anything.
The way I change them is by uploading the image to the WordPress media library and replacing the image name with the other image name.
My Questions:
Am I doing something wrong when trying to upload?
Is my image sized wrong?
(I'm running WordPress on academyofperformancearts.com.)
Your Wordpress theme might have an option for simply changing that image.
Try checking Appearance -> Customize in your admin panel.
if it's not there, your theme may have some addionnal settings in the menu, check thoroughly.
third option is a plugin defining it.
If not, your image happens to be located here : https://academyofperformancearts.com/wp-content/uploads/2016/03/parallax-img-940x446-1.jpg
So though it is not best practice with a Wordpress site, you may want to replace from here as last resort.
And don't forget to make backup when doing such changes, it is a not a correct solution and may give squishy results.
This question already has an answer here:
Protect images download theory
(1 answer)
Closed 7 years ago.
I want to hide images from my HTML code. I've disabled right click, which is pretty easy however the page source can still be viewed. Is there a way to hide all images from the HTML code so that the images cannot be stolen from the source code?
I'm afraid that there isn't a way to 100% stop a user of your site from getting into the code.
Not sure what the images are for but a couple of things you can do are:
Watermark your images.
Obscure the link by converting it into hexadecimal. (More on this on Google)
Bury it in divs or a table
Use Low Res images.
But as you've already disabled right-clicking that stops casual users from taking them.
Your browser will always need som kind of source to view the image, so you'll always be able to find it in the source code. However, there are ways to make it a little bit more complicated.
For example, using PHP, you can load the image through a script to hide the real URL and prevent some users from seeing it.
But remember, if the image is visible on the page, there will always be ways to steal it.
If you publish something in the web, you can't restrict the user. They can save anything from your page to their computer. But you can use watermarks on your images but still the user can download but can't steal.
Other way is you can convert your image into data-uri so user can not download the image. But it has its own limitation. But it may worsen your site's performance depending on number of images and size of the image.
The client doesn't want the photo to be downloaded if it is right clicked on. I explained if someone wants the photo they can get it off the site but he wants to make it a bit more difficult for a novice user to download the image. Hence if you right click you will get the blank 'photo' instead of the actual photo underneath.
Use logic:
Put the image you want to protect as a background image in a <div> or other block level element
Put an <img> that is transparent over that image in the <div>. Make sure it covers the entire image/div
A quick google has thrown this up for me, hope it can help you.
4) Prevent Downloads Using Tables: 'Right clicking' images is a fast shortcut to find, copy, and/or download images. For those that have their own website it is possible to prevent this action by placing images as a background to tables. The code is fairly simple in CSS, using the "background-image:url" style:
<table style="background-image:url('image.jpg');width:Wpx;height:Hpx"><tr><td></td></tr></table>
Another method might be,
5) Javascript Right Click Disable: Another measure to prevent right clicks on images is to use Javascript. These short scripts over-ride browser right clicks. Rather than recreate a script that has been widely published in various forms over the internet, I will leave it to the reader to search google for Javascript Disable Right Click. I will however mention that Javascript is client-side, and scripts such as these can not only effect the usability of a website, but can also readily be disabled by turning Javascript off.
I took the info above from this site --- http://www.naturefocused.com/articles/image-protection.html ---
People can just printscreen the image and put it in paint if they really wanted it though im afraid :(
Thanks,
Jack.
i have a image that i don't want it drag-able or selectable so that no drag to other places on the page. how is that done?
If you want your visitors/users to see the resource on your page there is no way to stop them downloading it or saving it.
Possible options:
You can use JavaScript to prevent the context-menu popping up on right-click (related article: http://javascript.about.com/library/blnoright.htm).
You can cover the image with a transparent .png or .gif so that clicking on the image simple returns the transparent image.
But if the user can see the image on the webpage then it's already on their computer.
In reality this is far harder than you may think it will be, I assume you don't want people stealing your images which is a fair enough thing but just remember all the different ways in which someone can get an image from a web site. Your can catch the right click event and stop them at least doing that, but they can always just take a screenshot and save that instead. This is a slippery slope and it always ends the same way, if they really want to steal it, they're going to.
Since the image is just a binary data, and all the data is written on client PC's, for displaying reason it's up to th euser what they'll do with the data. There's no way you can prevent them from saving the picture displayed on a website.
All you might do is make it a little bit harder, by blocking right clicking on image, (displaying alert on right click, or something like this). But if the user really wants to save the picture they will do this anyway.
Why should you do it?
I can suggest a javascript that will able it: http://www.brownielocks.com/stopcopying.html
But every one, even with little experience can view the source and copy it. and even if you block them from viewing the source, they can use wireshark and get the picture directly. Even if you use flash to show the picture one can screen-capture the screen and retrieve the picture.
Put a watermark on the picture and use http://www.tineye.com/ from time to time and search for your picture. If you find others that use your picture - sue them. It is the most effective way.
It is impossible to prevent someone to store an image (or other resources) on their computer as others already have mentioned.
But another trick to make it harder (impossible for inexperienced people I guess) is to use CSS and background images:
<div style='background: url("myimage.gif");'></div>
The image is now on the background of the <div> block and cannot be dragged or right clicked in order to save it.
Using some coding knowledge it is possible to ind out the myimage.gif part, which can be added after the base URL in order download the image and save it. For example if the HTML page is at http://www.example.com/mypage.html the image could be found at http://www.example.com/myimage.gif
As I mentioned it is still possible to save the image, but for inexperienced people it is a lot harder.
Note: In this example the image is just put in the HTML tag, but with proper use of a CSS file, it is even harder to find for inexperienced people.
You cannot prevent a user from saving something from the web to his PC. The nearest thing that comes to my mind is the -moz-user-select CSS property... https://developer.mozilla.org/en/CSS/-moz-user-select
This javascript snippet does exactly what OP asks:
document.addEventListener("dragstart", preventDrag);
function preventDrag(event) {
event.preventDefault();
}