Beste SD'ers,

Ik zat een beetje te surfen en toen vond ik deze onwijs handige feature om te hotlinken. Vertaald heb ik het niet, maar ik neem aan dat jullie dat zelf wel kunnen;-) Als je direct naar het voorbeeld wilt, moet je hier klikken: BlogStorm

Are you tired of people using images from your website without linking back to you? This simple script has the answer.
Most website owners hate hotlinkers and blame them for stealing valuable bandwidth and costing the website owner money without giving anything in return. In fact, images can be a very valuable way to build links to your site.
First of all, a few points to note. If you want to stop people hotlinking your images this script isn't for you, turning off hotlinking is an easy option in cPanel and fairly straightforward in htaccess as well. Also this strategy isn't really recommended unless you have unlimited bandwidth hosting. Some sites using this script use over 100GB a week just from hotlinked images.
The good stuff

Let say you wanted to use the image above (shamefully stolen from Matt but thats OK as long as he gets a link in return). Normally you would right click on it but this script stops that and simply gives you the code to use the image instead. Try it......

Remember that the majority of internet users who are looking for images to use on an eBay auction, blog post, myspace profile etc aren't aware of the implications hotlinking can have and are even less aware of the benefits that the backlink will provide to your website.
Most of you are probably thinking that your regular users will be upset if they can't use the right click function and you are quite correct.
The best way to make use of the script is to only show it to visitors who arrive from Google Images, Yahoo Images or MSN Live Search Images. Most of these visitors are likely to be after your images rather potential new customers so its safe to use this script. The key is to set a cookie when they arrive that expires after an hour, if the visitor likes your site and stays around you don't want to upset them.
Of course if your site doesn't have any regular users but enjoys traffic from Google Images then it might be acceptable to use this script all the time, in that case simply remove the cookie dependence.
What if I have thousands of pages?

This script works perfectly on database driven sites with lots of pages as long as your images are referenced in the database somehow. For example a product site will have an image of a product on each page and you will be able to use the image location to populate the textbox that hotlinkers will see.
If you are running a blog with lots of images embedded in the posts the script is a little harder to install. My favourite method is to parse the entire post and use a preg_match to find and output the images.

PHP Code:

<?php 
$match = Array();
if (preg_match("/]*>/", $blogpost, $match) !== FALSE) {
  // Make sure it truely was a match
  if ((count($match) != 0) && ($match[0] != "")) {
    // Save the image
    $theImage = $match[0]; //image now saved as $theImage
      }
    }

?>

Note: make sure you add a safeguard to handle posts with no images.

PHP Code:

<?php
if((preg_match("/images.google/i", $_SERVER['HTTP_REFERER']) == 1)||(preg_match("/images\/results.aspx?q=/i", $_SERVER['HTTP_REFERER']) == 1)||(preg_match("/search.yahoo.com\/search\/images/i", $_SERVER['HTTP_REFERER']) == 1)){
        setcookie("imagesearcher", "yes", time()+3600, "/", ".yoursite.com", 0); //1 hour cookie
}
if (isset($_COOKIE["imagesearcher"]) {

?><script type="text/javascript" language="JavaScript"><!--

function RemoveContent(d) {

document.getElementById(d).style.display = "none";

}

function InsertContent(d) {

document.getElementById(d).style.display = "";

}


function clickIE4(){
if (event.button==2){
InsertContent('imagelayer');
return false;
}
}

function clickNS4(e){
if (document.layers||document.getElementById&&!document.all){
if (e.which==2||e.which==3){
InsertContent('imagelayer');
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("InsertContent('imagelayer');return false")

// --> 
</script>
<div id="imagelayer" style="width:500px;margin-top:10px; border: 1px solid red; display: none;"><a href="javascript:RemoveContent('imagelayer')"><img src="http://www.blogstorm.co.uk/images/close.gif" alt="Close" title="Close" align="right" valign="top" border="0"></a>
<div class="bigtxt" style="padding:10px;" align="center" valign="top" width="500"><p align="left"><b>Copy the code below to use the image from this page on your website, blog, Myspace profile or eBay auction. .</b></p>
<textarea rows="4" cols="50"><a href="http://www.mattcutts.com/blog/firefox-2-out/"><img src="http://www.mattcutts.com/images/firefox-puppy2.jpg" border="0" alt="Firefox puppy"></a>

How to install
To install this script you will need to add it to each page of your site. The php that generates the cookie can be added to the top of each page and the rest added just above your images.
If you have any problems please post in the comments and I will do my best to help.

Our developers are working on a Wordpress plugin so you can include this script on every page of your blog - watch this space.


Bron: BlogStorm tevens is hier een vorbeeld te zien.

Opzich leuk, maar als je in de bron kijkt kun je alsnog de link naar de afbeelding vinden en hem zo downloaden :)