Prevent Hotlinking and Give a cute shame on them
Bandwidth is crucial on every websites because once you have run out of bandwidth your site will not be viewable by the public users and that will be really pain in your pocket to add more bandwidth on your hosting which is sometimes it’s not worth the upgrade because it might be a case of “HOTLINKING” basically this is process/technique where other websites get’s your images to load on their site using your own url and the downside of that is they consumes your bandwidth more because they did not upload the image on their site they just grab the absolute URL path of your image source like this
//Website 1 is called "http://domain1.com"
usually they need to upload the image on their site so they will have this image url code
img src="http://domain1.com/image.jpg"
// but usually other users do this
img src="http://domain-that-they-grab-the-image.com/image.jpg"
as you will notice they are loading the image from a different server/domain which is they do not own, so if that website have a limited bandwidth per month it may cause trouble for example their site is a very high traffic site so the more visit the more bandwidth it will consume on your end.
to fix this issue you just need to add some code on your .htaccess file which is usually located on the root of your directory , if your using WordPress you can easily find it on the root directory also
and then you need to add this line of code
#start of the rewrite
RewriteEngine on
#The third line means allow empty referralsthan your own mysite.com url
RewriteCond %{HTTP_REFERER} !^$
#blocks any sites other
#[NC] code means "No Case", meaning match the url regardless of being in upper or lower case letters
# change the yourdomain.com to your own domain
RewriteCond %{HTTP_REFERER} !^http(s)?://(www.)?yourdomain.com [NC]
#matches any files ending with the extension jpeg, jpg, gif, bmp, or png you can also add other filetypes
#change the yourdomain.com/image.jpg to the absolute path of your custom hotlink image
RewriteRule .(jpg|jpeg|png|gif)$ yourdomain.com/image.jpg [NC,R,L]
take note that when your adding a custom image it must be not be on the same domain that you are activating the hotlinking code your can use other domains or you can use dropbox and other cloud storage that you can access publicly as long as you can view the image if you point it to that domain or else you will have a redirection loop
but if you don’t want to load an image and just want it to be forbidden just change the last line of code to this
#this will just load the image as forbidden
RewriteRule .*.(jpe?g|gif|bmp|png)$ - [F]
here is an example of a website that actived the protection of hotlinking where people usually grab their cute photo’s so when you grab one of their photos and without uploading it to your server you will see this cute shameful image 🙂
the original link is https://pinoyscreencast.com/wp-content/uploads/2021/04/googly-gooeys-alphabet-of-social-networking-part21-460×736-1.jpg but as you can see it’s loading the cute image that you have just hotlinked an image LOL!
their website is googlygooey.com,
also in addition if you don’t want to copy the code above I mentioned you can just visit this website http://www.htaccesstools.com/hotlink-protection/ to generate the code for htaccess and be sure to check if your code works by pasting the URL of the image you have here http://www.htaccesstools.com/test-hotlink-protection/ be sure to clear your cache before viewing your image again because usually there is a cache version of your site stored on your browsers so clear that first.
So if your noticing that your bandwidth is consuming that it’s not the way it used to be be sure to add a hotlink protection so spammers and leechers will not consume your bandwidth 🙂 if you have further clarifications don’t hesitate to comment and we will be glad to help you out
