How to add watermark to an images on the fly with .htaccess

@asbness

Published in 

apache

 · 30 Oct 2023

How to generate a Watermark on the fly

Step 1

First, you need to create your one watermark.png image with your favorite image editor and simply call it "watermark.png".

Step 2

Create a watermark.php file and copy/past this code:

<?php 

  // loads a png, jpeg or gif image from the given file name 
  function imagecreatefromfile($image_path) { 
    // retrieve the type of the provided image file 
    list($width, $height, $image_type) = getimagesize($image_path); 

    // select the appropriate imagecreatefrom* function based on the determined 
    // image type 
    switch ($image_type) 
    { 
      case IMAGETYPE_GIF: return imagecreatefromgif($image_path); break; 
      case IMAGETYPE_JPEG: return imagecreatefromjpeg($image_path); break; 
      case IMAGETYPE_PNG: return imagecreatefrompng($image_path); break; 
      default: return ""; break; 
    } 
  } 

  // load source image to memory 
  $image = imagecreatefromfile($_GET["image"]); 
  if (!$image) die("Unable to open image"); 

  // load watermark to memory 
  $watermark = imagecreatefromfile($_GET["watermark"]); 
  if (!$image) die("Unable to open watermark"); 

  // calculate the position of the watermark in the output image (the 
  // watermark shall be placed in the lower right corner) 
  $watermark_pos_x = imagesx($image) - imagesx($watermark) - 8; 
  $watermark_pos_y = imagesy($image) - imagesy($watermark) - 10; 

  // merge the source image and the watermark 
  imagecopy($image, $watermark,  $watermark_pos_x, $watermark_pos_y, 0, 0, 
    imagesx($watermark), imagesy($watermark)); 

  // output watermarked image to browser 
  header("Content-Type: image/jpeg"); 
  imagejpeg($image, "", 100);  // use best image quality (100) 

  // remove the images from memory 
  imagedestroy($image); 
  imagedestroy($watermark); 

?>

Save it as "watermark.php".

Step 3

Create a ".htaccess" file and copy/past this code:

RewriteEngine on 
RewriteRule ^([^tn].*\.(gif|jpg|png))$ /images/jreviews/watermark.php?image=$1&watermark=watermark.png [NC]

If you are running your website in a subfolder, you need to put the entire path, ie. /yoursubfolder/images/...

Note: The "[^tn]" will exclude the thumbnails from being watermarked; if you want it, just remove it.

Step 4

Then upload the 3 files, watermark.png, watermark.php and .htaccess in your server, example www.yoursite.com/images/jreviews directory (not the tn folder).

Check your site and enjoy.

Step 5

The following code is able to do a better job with watermarking as it will resize watermark based on image size. I've seen it in action and it works great. There is also a possibility to save images on server when watermarked which would resolve the issue of server load.

function watermark($original_image,$original_watermark,$destination="") 
{ 
$image=imagecreatefromjpeg($original_image); 
list($imagewidth,$imageheight)=getimagesize($original_image); 

$watermark = imagecreatefrompng($original_watermark); 
list($watermarkwidth,$watermarkheight)=getimagesize($original_watermark); 

if($watermarkwidth>$imagewidth || $watermarkheight>$imageheight) 
{ 
$water_resize_factor = $imagewidth / $watermarkwidth; 
$new_watermarkwidth  = $watermarkwidth * $water_resize_factor; 
$new_watermarkheight = $watermarkheight * $water_resize_factor; 

$new_watermark = imagecreatetruecolor($new_watermarkwidth , $new_watermarkheight); 

imagealphablending($new_watermark , false); 
imagecopyresampled($new_watermark , $watermark, 0, 0, 0, 0, $new_watermarkwidth, $new_watermarkheight, $watermarkwidth, $watermarkheight); 

$watermarkwidth  = $new_watermarkwidth; 
$watermarkheight = $new_watermarkheight; 
$watermark       = $new_watermark; 
} 
$startwidth = ($imagewidth - $watermarkwidth)  / 2; 
$startheight = ($imageheight - $watermarkheight) / 2; 

imagecopy($image, $watermark, $startwidth, $startheight, 0, 0, $watermarkwidth, $watermarkheight); 
if(!empty($destination)) 
imagejpeg($image,$destination); 
else 
imagejpeg($image); 
} 

/* 
please comment this if you save the image on the server 
*/ 
header("Content-type:image/jpeg"); 

/* 
below is the same image with different sizes. 
Uncomment to see the change in size of the watermark 
*/ 

//watermark("image_big.jpg","watermark.png"); 
watermark("image_small.jpg","watermark.png"); 
?>