HackingUniversity - Hacks . Tricks . How-To's

03 May 2016

JavaScript to Disable Image Dragging on Webpage or Blog

stop image theftProtecting your content from copying freaks is a must thing for any blogger, either you are a professional blogger or a newbie you will face plagiarism problem once in your lifetime while blogging to make a living on the internet. Earlier I have posted many ways to stop content thief's from stealing content from your site. We discussed on how you can stop dragging on any blogger website and even using this same technique by implementing the CSS codes.

Still people can copy your content using other means, but we cannot loose hope implementing these codes and tricks still get your content theft down by certain percentage and that's what we want.

How to Stop your Images from Getting Copied from your Blog or Website

So today we will be showing you how you can stop any image on your blog from getting dragged and getting saved. Well you might be thinking this could be once again done using the right click, well next post will be on how you can stop right click and many other options on your blog or website but for people who just want to stop dragging of images could use below script.

Stop Image Dragging for Specific Image

In case you just want to stop image dragging feature from a specific image and don’t want to use the below script then below code could prove to be helpful.

<img draggable="false" src="image.png">

Adding the above red code in your image tag you are posting will stop dragging of that image easily.

Stopping every Single Image on a Webpage or Blog from Getting Dragged

Now if you just want to stop every single image on your blog from getting dragged and getting copied then below script will do the work. Lets see how you can implement this script on blogger and other websites like wordpress and so on.

  1. Open Blogger > Template > Edit HTML.
  2. Press Ctrl + F and search for </head> tag and paste below script above this tag.

    <script src='https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js'/>

     

    <script type='text/javascript'>
    $("img").mousedown(function(){
        return false;
    });
    </script>

  3. In case you are already using the jQuery mentioned above in red, then you can remove that else you need to include this code for your script to work fine.
  4. Now press Save Template and you have successfully implemented the script that will stop image dragging feature on your site.
  5. For other website also, you need to paste the code above the </head> tag and it will work fine.


I hope this will stop image theft from your site, do implement this script if you are concerned about your content, if you face any problem executing this script do comment below.