How do you prevent "Save as.." function like Namecheap does?

Technical Q&A
1

Priviet, Shopify Community!

Disclaimer:
I understand that it’s not really possible to stop all forms of piracy, it can always be copied one way or another, but at least prevent this simple technique?

Question:
How to prevent your whole site to be downloaded by right-clicking the page and clicking “Save as..”

So with Shopify, it’s possible to just right-click any Shopify store, and click “Save as..” This would save all the files on that page to your desktop, which you can upload to your own website and essentially steal everything with the smallest effort possible.

Namecheap prevents this, but how?

Example:

  1. Go to https://www.namecheap.com/promos/coupons/

  2. Right-click the site (I’m using google chrome)

  3. Click “Save as..”

  4. Save to your PC.

  5. When you open the HTML file, it is completely ruined, so it’s not as easy to steal their content.

Attachments showcasing what I mean:

Original site:

1.png
1.png1369×722 226 KB

After it’s copied with “Save as..” function:

2.png
2.png1359×840 75.2 KB

Is it possible to implement this into my theme, so people cannot save my site with 1 click?

2

@PavelBelsky

You can block the context menu from displaying for some web browsers by adding a line of JavaScript to your “layouts/theme.liquid” file like this:

Though you should not do that because it prevents those that use the context menu to open in a new tab or window from easily doing so..

Also, the reason why Namecheap looks like it does is because they were probably using relative URLs for files so if those files did not get downloaded then the cannot be found to use for styling/functionality.

Hope that helps!

3

@RobDukarski

Thank you Rob. Would it be possible to use relative URLs for files such as images and svgs on Shopify?

4

@PavelBelsky

Not to my knowledge. They are hosted via Shopify’s CDN which I believe is separate from the rest of the layouts/templates/sections/snippets.

If CSS, JS, and HTML are within the “assets” directory you may be able to use relative URLs from there but it is not something I have tested.

Frankly there’s not much you can do about someone wanting to copy the output of a web page. They cannot get the Liquid code as far as I am aware but whatever loads within their web browser they could try to download. (I believe some servers can block downloads or hot-linking images, or essentially replace downloads or images with different files when someone tries to download or hot-link them but I do not believe you have that luxury with hosted Shopify.)

Hope that helps!