-
AuthorPosts
-
August 17, 2017 at 2:45 am #840184
i’d like to know if i can put a code in that will DISABLE (at least for the average person) image saving / right-clicking / dragging-and-dropping.
thanks!
chris
August 17, 2017 at 6:04 am #840228Hey vlkwatchman,
Please, can you explain your question better?
Best regards,
John TorvikAugust 17, 2017 at 2:03 pm #840379john,
it’s very simple. i can’t explain what i want any better. i want to make it virtually impossible for the average person to come and save images off the site. either right-clicking on mac/pc … or dragging the image off the browser (mac).
how can i disable this? i’ve seen on other sites that do not allow me to save their images.
thanks!
chris
August 17, 2017 at 2:17 pm #840395Sup
You can add some javascript in the header
<script type='text/javascript'> //<![CDATA[ function nocontext(e) { var clickedTag = (e==null) ? event.srcElement.tagName : e.target.tagName; if (clickedTag == "IMG") { return false; } } document.oncontextmenu = nocontext; //]]> </script>
Or can add some jQuery
<script type="text/javascript"> $(document).ready(function(){ // this part disables the right click $('img').on('contextmenu', function(e) { return false; }); //this part disables dragging of image $('img').on('dragstart', function(e) { return false; }); }); </script>
It is kinda pointless though.
What is to stop someone screen shotting the page and cropping in paint or photoshop.
They could use windows snipping tool.
Remember that I mentioned in other post you can inspect a page? Do that and go to sources. On the left-hand side you can “steal” every resource on the site. The web and the internet is open. Nothing can be hidden if you know what to so.:)
TJ
August 17, 2017 at 2:20 pm #840398thanks TJ!! you rock.
like i said … “the average person” … :)
appreciate you,
chris
August 17, 2017 at 2:40 pm #840417hey there, tj,
is it possible to add the javascript to the header via wordpress? or do i need to do this outside of wordpress?
thanks!
chris
August 17, 2017 at 2:52 pm #840423hmm, tried both of these javascripts in the theme header (header.php in wordpress) … nothing happened.
did i miss a step? or am i on the wrong header?
thanks!
chris
August 17, 2017 at 2:57 pm #840431You can do it either way.
You can navigate to appearance>editor
On the right you can select to change the main theme files or the child theme.
Find theme header and bung the code in there just before the </head> tag.Running a child theme is advisable for two reasons
1) any changes carry over during an update.
2) If you screw things up you have the main theme as a fallback and way to check.Dunno how used you are to changing theme files but be careful. Any errors can wreck the site and you’ll need ftp access to change the files back.
If you have ftp access you can create a .js file and link to it from the header.
TJ
August 17, 2017 at 3:05 pm #840436thanks for the info!
yeah … neither javascript is working. i’m pasting each in the theme header (appearance > editor) just before the </head> tag.
i can still drag pictures off the page and save to my desktop.
strange.
well, we gave it a shot. if you think of anything else, please let me know.
thanks!
chris
August 17, 2017 at 5:44 pm #840535Hi Chris,
We’ll keep this thread open for you. Please let us know if you need more help with this topic.
Best regards,
SarahAugust 17, 2017 at 5:51 pm #840539well … still haven’t solved the problem yet. so please let me know if you know what the problem is!
is javascript being blocked in the header somehow by the theme?
any other code options?
thanks,
chris
August 18, 2017 at 5:12 am #840728bump. problem not solved yet. any ideas?
is javascript being blocked in the header somehow by the theme?
chris
August 18, 2017 at 12:39 pm #840842Java script won’t be being blocked by the theme.
If you right click and go to view page source you’ll see .js files being called in the header.While in the page source if you press ctrl+f and search for a word in the javascript we loaded you can check that it is loading correctly on the page. If you see it in the page source it’s loaded.
I’ve checked on a live page my end and the right click function works but dragging is still allowed. Boooooo :(
A css trick would be to disable pointer-events on images…
img {pointer-events:none!important;}
That should render the images as none clickable. Problem is if you have any images as links… they wont work.
Possible solution give every image you want to protect a class of you-cant-steal-this then use….you-cant-steal-this img {pointer-events:none!important;}
Long winded and a ball ache to add class to every image but would do the trick… i think :)
TJ
August 18, 2017 at 6:26 pm #840985ah, yes! the dragging was still allowed. that’s what i didn’t want, especially for mac users. too easy. :)
THANKS!! THIS WORKS!! sweet, tj!!
the only thing i can think of where this is going to hurt me … is that i will likely be adding a PayPal button. and that’s an image. ugh.
i may try your “class protection” method. how do i add the class for all the images i want to be protected? thanks for the code to protect that class.
appreciate you so much,
chris
August 19, 2017 at 6:33 pm #841356Hi Chris,
You can turn on custom class for all elements. Here is how to do it:
If you need further assistance please let us know.
Best regards,
VictoriaAugust 21, 2017 at 2:11 pm #842006it’s funny. i have a PayPal image button and the link still works, even with the codes to disable clicks.
so we’re good!
thanks!
we can close this ticket.
chris
August 23, 2017 at 12:50 pm #842996again, we can close this.
thanks,
chris
-
AuthorPosts
- The topic ‘is there a code i can use to DISABLE IMAGE SAVING / DRAGGING?’ is closed to new replies.