Yes, there are a few techniques you can use in Cargo (or any site where you have HTML/CSS access) to discourage right-click saving or copying of images, but it's important to note:

There is no foolproof way to prevent image theft on the web. If an image can be viewed in the browser, it can be copied (e.g. via screenshot or developer tools).

However, you can make it harder for most casual users. Here’s how you can implement a site-wide invisible overlay to block right-clicking and "save as" on images:

✅ Option 1: CSS overlay over all images


This method places a transparent div on top of every image using a pseudo-element.

CSS:
cssCopyEditimg {
 position: relative;
 z-index: 1;
}img::after {
 content: "";
 position: absolute;
 top: 0; left: 0;
 width: 100%;
 height: 100%;
 z-index: 2;
 background: transparent;
}

Important: You also need to make sure the parent container is position: relative;, otherwise ::after won't position correctly. In Cargo, depending on how your theme handles images, you may need to wrap the images in a container and apply this there.

✅ Option 2: Use a transparent overlay layer site-wide


If you want a global invisible layer on top of the entire site just for images:

HTML (placed site-wide, e.g. in the site layout):
htmlCopyEdit<div id="image-blocker"></div>

CSS:
cssCopyEdit#image-blocker {
 position: absolute;
 top: 0;
 left: 0;
 width: 100vw;
 height: 100vh;
 pointer-events: none;
 z-index: 9999;
}
img {
 pointer-events: none;
}

This disables all interaction with images. Users won’t be able to right-click or drag them. However, it may also break image-based links or sliders unless you selectively target only the images you want to protect.

✅ Option 3: Disable right-click via JavaScript


You can use JavaScript to disable right-click context menus:

JavaScript:
htmlCopyEdit<script>
 document.addEventListener("contextmenu", function(e) {
 if (e.target.tagName === "IMG") {
 e.preventDefault();
 }
 });
</script>

This disables right-click only on images.

🛑 Important considerations


  • These methods discourage, but do not prevent downloading via dev tools or screenshots.

  • Watermarking or using low-res versions is often more effective for deterrence.

  • Hiding images behind background images in CSS is another approach, but it affects SEO and accessibility.