Image hotlinking is a practice that involves someone using an image hosted on your website by embedding it on their website. This might seem like a victimless crime, but it increases your website’s bandwidth usage – and increases the load on your servers.
This is exacerbated when you pay a licensing fee for some content, and it is hotlinked without your permission.
If you suspect that someone is hotlinking to your assets, you can tackle this by using a combination of the following methods.
Rename Your Assets
Renaming your web assets is the easiest way to stop existing hotlinks. Change the image file names to something unique, and it will immediately break any links between your site and those websites that have hotlinked to your images.
Changing the name will return a 404 error when the other site attempts to fetch this asset from the old URL. However, this will also break your site – you will need to ensure that all the pages on your site that refer to the old URL now refer to the new URL for the image.
This is a quick and easy fix, but only for existing links. Other sites can still link to it in the future. Moreover, this method requires you to manually change each file, which is very inefficient and has a high probability of something being misconfigured.
Use Scrape Shield
Cloudflare offers a Scrape Shield feature that can prevent hotlinking. This feature blocks the request when it originates from a visitor on another site.
It has an additional feature that enables you to selectively allow directories that can be hotlinked.
Read our article on how to use Cloudflare firewall rules to protect your web application.
Watermark Your Images
You can watermark your images, audio clips, PDFs, etc. This will discourage other sites from embedding your assets on their site. If you replace your existing assets with watermarked copies, any sites hotlinking to your images will start to display watermarked copies, and promote your brand.
There are many ways you can do this. You can add your brand name in images, add an audio recording of your website address in audio clips, put headers in PDFs and other documents, rename zip files to include your site name, etc. Although this will work to some extent, it is not a foolproof solution.
Block Hotlinks With .htaccess on WordPress
You can also prevent hotlinking by adding a few lines of code to your website’s .htaccess file. This code will block access to your images from any website that is not whitelisted. Here’s an example of what the code should look like:
RewriteEngine on
RewriteCond %{HTTP_REFERER} !^$
RewriteCond %{HTTP_REFERER} !^http(s)?://(www\.)?example.com [NC]
RewriteRule \.(jpg|jpeg|png|gif)$ - [NC,F,L]
In the above code, replace example.com with your domain name. If you want to allow more than one domain to access your images, then you can copy the third line in the above code and add a second domain name.
The fourth line in the above code lists the file extensions separated with a | operator. You can modify this line to add or remove the file types that you wish to block. The [NC, F, L] at the end of the RewriteRule is a set of flags that control how the rewrite rule is applied. Here’s what each flag does:
- [NC]: The NC flag stands for “No Case” and tells the server to ignore the case sensitivity of the matched string. In other words, it makes the rule case-insensitive. So, if someone tries to access a hot-linked image using a different case for the file extension (e.g., “.JPG” instead of “.jpg”), the rule will still apply.
- [F]: The F flag stands for “Forbidden” and tells Apache to return a 403 Forbidden error to the hotlinking site. This means that the hot-linked image won’t be displayed, and the visitor to the hot-linking site will see an error message instead.
- [L]: The L flag stands for “Last” and tells Apache to stop processing any further rules if this one is matched. This can be useful if you have multiple rewrite rules in your .htaccess file and you want to ensure that only this rule is applied to hot-linked images.