How to Prevent Right Click in Joomla?

Many of our customers ask us to disable right click on their Joomla website. As such, we have decided to write a post explaining how this is done.

Before starting, you need to be aware of the following:

  • Preventing right clicks will only deter non-technical visitors from stealing your content (such as text and images). Right click prevention can be easily overcome by simply disabling JavaScript in the browser settings.
  • Preventing right clicks will not affect your search engine rankings, and search engines will still index your website normally (search engines tend to ignore JavaScript code on your website, unless, of course, it’s malicious).

  • Even if the person has not disabled JavaScript, he will still be able to copy content from your website by simply selecting the text and then clicking on CTRL+C.

Now that you know that preventing right clicks is not an efficient way to protect your content, let us explain to you how you can do it.

The first thing you need to do is to copy the following code:


<SCRIPT TYPE="text/javascript">

<!--
var msg = "Right click disabled"; //change this message to a message of your own if you want
var showMsg = 1; //change this to 0 if you do not want to show any popup messages when the user right clicks

function internetExplorerRightClick(){ //code to handle right clicks in Internet Explorer
if (document.all){
if (showMsg == 1){
alert(msg);
}
return false;
}
}

function firefoxRightClick(e){ //code to handle right clicks in Firefox and Chrome (as well as other obsolete browsers such as Netscape)
if ((document.layers) || (document.getElementById && !document.all)) {
if (e.which==2 || e.which==3){
if (showMsg == 1){
alert(msg);
}
return false;
}
}
}

if (document.layers){
document.captureEvents(Event.MOUSEDOWN);
document.onmousedown=firefoxRightClick;
}
else{
document.onmouseup=firefoxRightClick;
document.oncontextmenu=internetExplorerRightClick;
}

document.oncontextmenu=new Function("return false");

// -->
</SCRIPT>

The next thing you need to is to open your Joomla template for editing and place (paste) the above code within the <head> HTML tag. Here’s how you do this:

  • Login to your Joomla website as Super Administrator
  • Click on Extensions, and then click on Template Manager
  • Click on the name of the default template (the template that has a yellow star next to it)
  • Click on Edit HTML on the top right
  • Paste the code above just after the <head> HTML tag
  • Click on Save on the top right
  • That’s it!

Now if you don’t want to display any messages when the user right clicks on your website, then all you need to do is change the value of showMsg to 1.

If you need any help doing the above, then all you need to do is to Contact us. We are very friendly, and we’re always there to help!

10 Responses to “How to Prevent Right Click in Joomla?”
  1. Pingback by How to Protect Your Content on Your Joomla Website | itoctopus — January 25, 2012 @ 4:34 pm

    […] right-clicking: You can disable right clicking on your Joomla website by adding some JavaScript code either in your main template or in a Jumi module that is available […]

  2. Comment by Bruce — May 26, 2015 @ 4:23 am

    Worked like a charm. Thanks! (it would help to specify the exact file that needs to be adjusted for neophytes like me – index.php)

    Thanks for the assistance!

  3. Comment by Fadi — June 12, 2015 @ 10:17 am

    Hi Bruce,

    Excellent! What’s interesting is that this post was written some very long time ago! The nice thing about it is that it doesn’t use any JavaScript library (so you won’t run into conflicts and you don’t need to include external JS library) and that it works on all browsers.

  4. Comment by Zand — September 1, 2015 @ 11:05 pm

    Hi there, Does this code work with Joomla 3.4.3 templates? is so, what file do i have edit and where should I add the code exactly? Thanks in advance for your help!

  5. Comment by Fadi — September 2, 2015 @ 10:20 am

    Hi Zand,

    Yes – this still works on Joomla 3 because the code doesn’t use any JavaScript library.

  6. Comment by Alex — November 5, 2015 @ 7:43 am

    It works if I copy/paste the code directly onto the index.php file but if i create a .js file, it doesn’t work (obviously I’m doing something wrong).

    Also, when copied onto the actual index.php file it blocks other modules/plugins like the videoshare player. My videos stop working so now I removed the code from the head of the php file.

    Is there any way to load this code not directly onto the php file?

    I followed the above steps from the admin panel and that did not work either.

    Thanks!

  7. Comment by Fadi — November 5, 2015 @ 7:49 am

    Hi Alex,

    If you open the Google Chrome console with the code pasted onto your index.php file, and then you try working with the Video player, what kind of errors do you see?

  8. Comment by Alex — November 5, 2015 @ 2:41 pm

    Hi Fadi,

    I disabled the script and the player is working again. The company that built the video player said the script copied at the head is breaking the XML.

    You must not add the JavaScript directly in index.php and the proper way to add this is using a system plugin plugin or your theme’s JavaScript loader option if they do provide. The script which you have added also affected our configuration XML and it breaks the player from loading this.

    I tried several plugins from Joomla for right click but they all disable some part of the site. The site is heavy on responsive technologies, graphics, Roksprocket, MooTools and many other widgets…so something else breaks when I add Javascript to the head section. So I should try the loader option as the plugins are not working.

  9. Comment by Fadi — November 5, 2015 @ 3:00 pm

    Hi Alex,

    Actually it’s no a problem adding the script to the main template file. Of course, you can use a plugin to do that, but for these little things there is nothing wrong with adding the JavaScript to the index.php file. A lot of things go there (in the index.php file) by the way, including Google Analytics code, and other tracking codes. Of course, there are plugins that can do that, but it’s much lighter to do this in the template file itself rather than creating a plugin for such a simple task.

    In any case, on a technical level, having the script in the index.php file or in a plugin amounts to the exact same thing (when it comes to the end result). If the creators of the video extension that you’re using can provide you with a clear technical answer on why the script was conflicting with them (how it’s breaking their XML) then we’d be happy to edit the code in this post.

    PS: Have you tried to check the Chrome console to see what kind of errors are thrown there?

  10. Comment by Alex — November 6, 2015 @ 8:51 am

    Hi,

    I put it back in the index.php (template level) and made some minor changes and it is working and the video player is working as well.

    So far it seems everything is working. On the mobile device (e.g. iPhone), one section seems to get stuck (mod_roksprocket) but no biggie for now.

Leave a comment