Question:
Can I lock images on website, and stop images from being dragged onto to desktop?
There are a few ways to stop simple drag and drop of images but if someone is determined to get an image of a website there is no real way to stop them, they can either screen grab or use the browsers built in inspectors to get them.
Wix Images do not have any drag api so you cannot afaik do it in velo code.
You can though use standard css and JS in you head file if you are on a premium site.
(and probably custom css if you are using Wix Studio … Booo for Wix Editor neglect )
in you custom code. you can add this code.
<script>
document.addEventListener("DOMContentLoaded", function() {
document.querySelectorAll("img").forEach(img => {
img.addEventListener("contextmenu", function(event) {
event.preventDefault(); // Disables right-click
});
});
});
</script>
<style>
img {
-webkit-user-drag: none; /* Chrome, Safari, Edge */
user-drag: none; /* Standard */
pointer-events: auto; /* Ensure clicks still work */
}
</style>
This (only tested in Safari) should stop a casual user from dragging and image or right clicking it to get context menus which normally give some image options.
It will not stop someone who knows what they are doing in the browsers inspector.
Note: the may be ways to make it harder by converting images to blobs, but I do not think wix has anything built in for that.
1 Like