How to Disable Right Click on Shopify [Without an App]
You know how you can right click on websites to see more options, inspect elements, and stuff like that? Well, as a Shopify store owner, you might want to turn off right clicking on your store for security or other reasons. Don’t worry, there is an easy way to do it without installing any Shopify apps.
Table of Contents
Why Disable Right Click on Shopify?
There are a few reasons why store owners may want to disable right clicking:
Prevent Copying of Content
Disabling right click can help prevent visitors from easily copying text or images from your site. This may be useful if you want to protect unique product descriptions, blog content, or other proprietary information.
Improve Security
Disabling right click makes it harder for tech-savvy visitors to inspect page elements or view your site’s source code. This adds a small layer of security obfuscation.
Create a Cleaner Experience
Some store owners disable right clicking simply to provide a cleaner, distraction-free experience without messy context menus popping up. This creates a more app-like feel.
Of course, disabling right click also comes with downsides: it reduces accessibility and goes against general web conventions. But if you decide the benefits outweigh the downsides for your particular store, implementing it is straightforward.
How to Disable Right Click on Shopify
Disabling right click only requires a few lines of JavaScript code added to your theme’s theme.liquid
file. Here is the step-by-step process:
1. Go to “Online Store” > “Themes” > “Actions”
First, log in to your Shopify admin and navigate to Online Store > Themes > Actions. This is where you can edit code and themes.
2. Duplicate Your Theme (Optional)
Before making any code changes, it’s good practice to duplicate your existing theme. This creates a backup you can revert to in case something goes wrong.
To duplicate the theme, click “Duplicate” next to the current theme name. Give your duplicate theme a name like “My Theme Copy” and click “Duplicate” again.
3. Go to “Edit Code”
Next, click the “Edit code” button for your theme (either the original or your new duplicate). This will open the code editor.
4. Click on “theme.liquid”
In the left sidebar, click to open the theme.liquid
file. This is the main theme template file where global code changes are made.
5. Paste This Code Above </head>
To disable right click, paste the following code into theme.liquid
above the closing </head>
tag:
<script> /* Prevents right-click */ window.oncontextmenu = function() { return false; } </script>
To find the closing </head>
tag:
- On Mac, use Cmd + F to open the Find search box
- On Windows, use Ctrl + F
- Search for
</head>
Paste the code below <head> and right above </head>tag. Which i have placed accordingly.
And that’s it! With just those few lines of JavaScript, right clicking will now be disabled on your Shopify store.
Wrap Up
Always backup themes before changing any code in your store, so that when you mess up with code – you can backup your store. If the above code is not working try to clear cache of your browser and refresh it. Find below video guide if you still need more help..