How to disable right click on images on your website

There are different ways you can use to prevent image theft from your website. For instance you may choose to disable right click, dragging and saving of images on computers and phones. Below are two types of scripts that will disable the right click menu from appearing when users right click the mouse on your website.

Script 1

Copy and paste the code below into your header or body of a single webpage you wish to disable right click on. The 6th line of the disable right click script contains a place to add a message. Find var message=”Right click is disabled!”; in the script below and replace “Right click is disabled!” with the message you wish to send your visitors who right click on your website.

<script language="JavaScript>
<!–

//Disable right mouse click script


var message="Right click is disabled!";


///////////////////////////////////
function clickIE4(){
if (event.button==2){
return false;
}
}


function clickNS4(e){
if (document.layers||document.getElementById&&!document.all){
if (e.which==2||e.which==3){
return false;
}
}
}


if (document.layers){
document.captureEvents(Event.MOUSEDOWN);
document.onmousedown=clickNS4;
}
else if (document.all&&!document.getElementById){
document.onmousedown=clickIE4;
}


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


// –>
</script>

Script 2

Go to header, and paste the following code.

<script type="text/javascript">
  function nocontext(e) {
    var clickedTag = (e==null) ? event.srcElement.tagName : e.target.tagName;
    if (clickedTag == "IMG")
      return false;
  }
  document.oncontextmenu = nocontext;
</script>

Once you’ve pasted the code, click “Save” and proceed to add custom CSS. For more help on entering custom CSS, check out the CSS tutorial for your website. In the text box, paste the following code.

img {
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-user-drag: none;
  user-drag: none;
  -webkit-touch-callout: none;
}