How to disable right click on Shopify

August 16, 2026
Image Management, Shopify Tips
14 min read
a computer mouse with its right button marked with a small cross, beside a product photo card and a small closed padlock

To disable right click on Shopify you add about six lines of JavaScript to theme.liquid, because Shopify has no built in setting for it. That is the entire answer, and the code is below. What almost nobody tells you is the part that comes after: the same snippet does nothing whatsoever on an iPhone, because the contextmenu event does not exist in Safari on iOS.

So this post gives you the working code first, then the honest map of what it stops and what strolls past it. We ran live tests against the Shopify CDN while writing this, and some of the results are worse than you would guess.

Shopify itself is refreshingly blunt about the ceiling here. Under a heading called “Protect your images”, its help docs say: “You can’t prevent people from saving your on-screen images, but you can use an app from the Shopify App Store to add a watermark.” When the platform tells you the technique has a limit, believe it.

In this post

Does Shopify have a right click setting?

No. There is no toggle in theme settings, no checkbox in preferences, nothing in the admin. Shopify does give you a native Custom CSS field (Theme settings, Custom CSS in the theme editor), capped at 1,500 characters for the theme and 500 per section, and that field handles part of the job. There is no matching Custom JavaScript field, which is why the right click half needs a code edit.

Two more things worth knowing before you open the code editor. Shopify’s docs warn that “if changes that you’ve made to a theme’s code are incompatible with a theme update, then all your code changes are removed in the updated copy”, so this snippet is something you will re-apply after big theme updates. And Shopify Support “doesn’t write custom code”, so if you break something, that is your Saturday.

Duplicate your theme before you touch anything. Always.

The code, and where it goes

Online Store 2.0 changed where code can live: JSON templates hold only a list of sections and their settings, so no script can go in them. Shopify’s docs put it directly: “If you’re using a JSON template, then any HTML or Liquid code needs to be included in a section that’s referenced by the template.” Which leaves theme.liquid, the one layout file that wraps every page, and which must exist for a theme to upload at all.

  1. Shopify admin, then Online Store, then Themes
  2. On your live theme, open the three dot menu and pick Duplicate. Do this first.
  3. Three dot menu again, then Edit code
  4. Open layout/theme.liquid
  5. Paste the block below immediately before the closing </body> tag, then Save
<script>
  // Block the right click menu on images only.
  document.addEventListener('contextmenu', function (e) {
    if (e.target.tagName === 'IMG') e.preventDefault();
  });

  // Block dragging an image to the desktop.
  document.addEventListener('dragstart', function (e) {
    if (e.target.tagName === 'IMG') e.preventDefault();
  });
</script>

That is it. Two listeners, both calling preventDefault(), which tells the browser not to take its default action.

Note the tagName === 'IMG' check. Most snippets you find online block right click on the entire document, which also kills “open link in new tab”, “back”, spell check in your search box, and every other thing a normal shopper uses a right click for. Blocking the whole page to protect photos is like locking the front door by welding it. If you want the blunt version anyway, drop the if and keep e.preventDefault().

One platform note that saves a support ticket: a default Shopify storefront sends no script-src content security policy directive, so an inline script in theme.liquid is not blocked. If yours throws a CSP error, you or an app added a CSP meta tag of your own.

The CSS half: selection and drag

Right click is one save path. Selecting and copying is another, and dragging an image straight to the desktop is a third that Apple documents openly for Safari on Mac. The CSS below goes in that native Custom CSS field, no code editor needed.

img {
  -webkit-user-select: none;  /* Safari */
  -moz-user-select: none;     /* Firefox */
  user-select: none;
  -webkit-touch-callout: none; /* iOS only, see below */
}

You can also set draggable="false" on image tags, though it has to be written in full because the attribute is enumerated, not boolean. In practice the dragstart listener above covers it without editing every image.

Do not skip this next bit, because it is the CSS Working Group talking about its own property. The spec for user-select says: “none is not a copy protection mechanism, and using it as such is ineffective: user agents are allowed to provide ways to bypass it”. The people who wrote the feature are telling you what it is for. It is a UI convenience, not a lock.

Why it does nothing on an iPhone

Here is the thing that makes most “protect your Shopify images” tutorials wrong.

Safari on iOS does not support the contextmenu event. Not “supports it partially”, not “fires it late”. MDN’s browser compatibility data records it as unsupported on Safari iOS, and the WebKit bug tracking it, filed in July 2020, is still open. A WebKit engineer wrote on it in 2021: “As far as I am aware, there is no mainstream UI way to trigger a contextmenu event in iOS WebKit.”

So on the device where more than half your traffic sits, long press still opens the sheet with Save to Photos, and your snippet never runs.

The iOS answer is supposed to be -webkit-touch-callout: none, which controls “the default callout shown when you touch and hold a touch target”. Two caveats. MDN labels it non standard and it works only in Safari on iOS and iPadOS, not Chrome, not Firefox, not even desktop Safari. And it is flaky on current iOS: there is an open Apple developer forum thread from November 2025 reporting that it fails on iOS 26.1 even with !important, with no reply from Apple. Adding -webkit-user-select: none to the parent element is the workaround people report.

Android Chrome behaves better: it does fire contextmenu on long press, so the snippet suppresses the Download image and Search image with Google Lens options. That means your protection currently works on one mobile platform and not the other, which is not a plan, it is a coin flip.

There is still no standard, cross browser way to do this. A proposal to add a touch-callout property was opened with the CSS Working Group in May 2025 and is still sitting there unresolved, noting that “there is presently no standardized, cross-browser method to disable touch callout menus.”

Every way someone walks past it

Being honest about this is the whole point, so here is the list.

  • Firefox, Shift and right click. MDN documents it: the menu opens and the event never fires. It is a live preference, on by default, and a bug asking to change that has been open since 2007.
  • Two keystrokes in DevTools. Command palette, “Disable JavaScript”. Every script based block dies for as long as DevTools stays open.
  • The Network panel. Filter by Img, open the Preview tab, right click, Copy URL. No page scripts involved.
  • A browser extension. One popular “enable right click” extension has roughly 400,000 users and was updated in March 2026. This is a solved problem for anyone who wants it solved.
  • The disk cache. The file is already on their machine before your listener attaches.
  • A screenshot. No web API can see it, let alone stop it.
  • The URL itself. See below, because this one is worse than people expect.

We ran live requests against a real Shopify product image while writing this. No referrer, no cookies: HTTP 200, full file. A hostile third party referrer, the classic hotlink scenario: HTTP 200, byte for byte identical. Fake signature and expiry parameters: ignored, still 200. Strip the ?v= version parameter: still 200, because that is a cache key, not a key.

And appending ?width=4096 returns the full resolution master, six megabytes of it, regardless of the smaller version your theme actually renders. The responses carry access-control-allow-origin: *, which means any script on any domain can pull your image into a canvas and re-encode it.

You do not even need to guess filenames, because Shopify publishes them. The unauthenticated /products.json endpoint lists CDN image URLs, and the auto generated image sitemap does the same. There is no hotlink protection, no referrer checking, no signed URLs and no expiring URLs for storefront product images, and a Shopify staff member confirmed in 2024 that hotlink protection “is not something we directly support at this time”.

Which brings us to the real point. Right click blocking stops one visitor type: the casual browser who would have right clicked. It does nothing against scrapers, because they never run your JavaScript in the first place. That is not useless, casual copying is genuinely most of the volume, but it is a doormat, not a lock.

Does it hurt SEO or accessibility?

SEO: no. Googlebot renders JavaScript with an evergreen Chromium, but it never right clicks, never selects text and never long presses, so there is no surface for the block to act on. There is no documented Google position on right click scripts at all, because there is nothing to have a position about.

Accessibility: also no, with two big exceptions. We went through the full WCAG 2.2 failure index, F1 to F113, and not one names right click, context menus, selection or copying. The keyboard criterion covers functionality of the content, and the browser’s own menu is user agent functionality, not yours.

The exceptions are where people get creative:

  • Blocking pinch zoom to stop mobile saving fails WCAG. A viewport tag with user-scalable=no or maximum-scale=1 fails success criterion 1.4.4 Resize Text, and there is a W3C test rule for exactly that. Do not do it.
  • Swapping image tags for CSS background images breaks two things at once. Google states flatly that “Google doesn’t index CSS images”, so your product photos vanish from image search, and WCAG failure F3 covers conveying information through CSS backgrounds because you cannot attach alt text to them.

One more subtle cost. Because preventDefault() is input agnostic, blocking contextmenu also blocks the dedicated context menu key on a keyboard, which is how some people navigate. Scoping the handler to images, as in the snippet above, keeps that damage local.

While you are in the code, it is worth checking what else your theme is doing to your images. Our free product image audit flags missing alt text and thin galleries, and the image compressor handles the file size side, which matters far more to your rankings than any of this.

When the app route is worth $0 to $5

If you have one theme and you are comfortable in theme.liquid, the snippet above is free and takes five minutes. Genuinely. Do that.

The calculation changes on three fronts: you run several themes or reapply the edit after every theme update, you want the mobile and DevTools shortcut cases handled without maintaining the code yourself, or you have realised that blocking is the weak half of the job and you want the mark that survives the download. A catalog of 600 products at five photos each is 3,000 files, and no snippet on earth protects any of them once they are copied.

That is where an app earns its keep: Viking Watermark blocks right click, copy and drag save from a theme embed and stamps your logo across the catalog in bulk, keeping originals in Shopify Files so any product restores in one click. Storefront protection is on every plan including the free one, and paid plans start at $5 a month. It holds 5.0 stars from 6 reviews, which is a new app rating, not a proven one, and you should read it that way.

Storefront protection settings blocking right click, copy and drag save on a Shopify store

Whichever route you take, do not stop at blocking. Shopify’s own advice, in the same sentence where it tells you that you cannot prevent saving, is to add a watermark. The developer has a walkthrough of the mobile side specifically on their own blog, and we go deeper on the layering argument in does blocking right click protect Shopify images.

And keep the rest of your image stack tidy while you are here. Protection is pointless if the gallery shows the wrong colour: that is what variant image filtering handles, and stores that keep colours as separate products lean on combined listings instead.

FAQ

Does Shopify have a built in way to disable right click?

No. There is no theme setting or admin toggle. You either add a small script to theme.liquid yourself or install an app that injects it through a theme embed. Shopify does provide a native Custom CSS field, which covers text selection but not the right click menu.

Does disabling right click work on mobile?

Partly. Android Chrome fires the contextmenu event on long press, so the block works there. Safari on iOS does not support the event at all, so a script alone changes nothing on iPhone. The iOS specific property is -webkit-touch-callout: none, which is non standard and currently unreliable.

Will blocking right click hurt my Google rankings?

No. Googlebot renders JavaScript but never right clicks or selects text, so there is nothing for the block to affect. What does hurt image search is replacing image tags with CSS background images, since Google states it does not index CSS images.

Will a theme update remove the code?

It can. Shopify warns that code changes incompatible with a theme update are removed in the updated copy. Keep the snippet somewhere outside the theme, note it in your update checklist, and duplicate the theme before every edit.

Can I stop people hotlinking my Shopify images?

Not on the Shopify CDN. Live tests show images served to any referrer, with no signed or expiring URLs, and Shopify staff confirmed hotlink protection is not supported. Shopify also publishes image URLs through products.json and the image sitemap.

Is blocking right click worth doing at all?

Yes, as the cheap half of a pair. It removes the easiest save path for casual visitors, which is most of the volume, and it costs nothing. Just do not treat it as protection on its own, because a screenshot, DevTools or a direct CDN request all beat it.

Paste the snippet. Then open your store on an iPhone, long press a product photo, and watch Save to Photos appear anyway. That moment is the whole argument for the second layer.

Add the second layer free →

Co-Founder at Craftshift

You may also like