Watermark Images on the Fly in PHP Article

Share this article

Let’s suppose that you’ve just been given five screenshots from the biggest upcoming video game of the year. You want to share your screenshots, but credit has to be given where credit is due — after all, you haven’t been sweet-talking public relations representatives for fun, right?

The solution is to watermark the images. But the standard watermarking procedure of editing the image in a photo-editing application is time consuming. PHP offers a far better solution.

PHP 4+ and GD 2.0+ represent a powerful combination when it comes to creating or altering images dynamically. In this tutorial, we’ll look at some of the GD and standard PHP functions as we watermark images on the fly.

The Script

The script, just 13 lines in length, begins with a header() call to tell the Web browser that we are going to output an image in JPEG format. Without this line, a page calling the script via the HTML <img> tag will receive a broken image and, if the script is accessed directly, the user will see the image data as plain text.

Specifying the content type is unnecessary with most PHP scripts because “text/html” is the default content type for PHP scripts.

header('content-type: image/jpeg');

Now that the browser is ready for an image, we can start to calculate the mathematics of the watermark placement and load the images.

The Watermark

A file titled ‘watermark.png’ (notice use of the PNG format; GD 2.0+ has removed compatibility with GIF images) should be located in the same directory as the script. If not, change the file path in the following function call, which will load the watermark image. The file should be a PNG-8 format file, not PNG-24. There’s a bug in the current version of GD, which doesn’t support PNG-24 correctly.

$watermark = imagecreatefrompng('watermark.png');

Our operations used later in the script will need to know the exact height and width, in pixels, of this watermark image. These dimensions will be used to place the watermark in a relative position on the image. Let’s use imagesx() and imagesy() (not GD functions, but standard PHP functions):

$watermark_width = imagesx($watermark);  
$watermark_height = imagesy($watermark);
The Image

Now, we’ll create from the JPEG file an image that we want to have watermarked, and set it as a variable, $image. By using the imagecreatefromjpeg() function, we load the file into the PHP script using the GD library. This gives us the opportunity to manipulate and/or output the image using our script.

$image = imagecreatefromjpeg($_GET['src']);

We’ll keep the script simple by using a variable, $_GET['src'], which should have the complete path to the file that needs to be watermarked. Alternatively, you can build the path in the script, which is a bit more secure and private. As long as that function receives the full path as its first parameter, everything will be fine.

Next, we are going to make some dimension calculations on the image being watermarked. These dimension calculations will be completed (for no other reason but to learn about new functions} using the getimagesize() function. The getimagesize() function works by returning an array where key “0” = width and key “1” = height.

The procedure of the next three lines of code are to:

  1. grab the dimensions of the image we want watermarked, $image

  2. subtract the corresponding dimension from our watermarking image

  3. add a 5 pixel margin

Finally, we should be left with the exact pixel (further referenced as the “destination location”) at which where our watermarking image ($watermark) should be placed on the image to be watermarked ($image):

$size = getimagesize($_GET['src']);  
$dest_x = $size[0] - $watermark_width - 5;  
$dest_y = $size[1] - $watermark_height - 5;
Merging the Image and the Watermark

Here is the most complex function in the entire script: imagecopymerge(). The official syntax for this function is:

int imagecopymerge ( resource dst_im, resource src_im, int dst_x, int dst_y, int src_x, int src_y, int src_w, int src_h, int pct )

This excerpt from the manual explains this function better than I ever could:

Copy a part of src_im onto dst_im starting at the x,y coordinates src_x, src_y with a width of src_w and a height of src_h. The portion defined will be copied onto the x,y coordinates, dst_x and dst_y. The two images will be merged according to pct which can range from 0 to 100.

(Source: PHP Manual)

In short, the following line of code merges the two images using the destination locations we calculated earlier:

imagecopymerge($image, $watermark, $dest_x, $dest_y, 0, 0, $watermark_width, $watermark_height, 100);

Our final lines of code will output the image merged with the watermark to the browser using imagejpeg(). They will then use imagedestroy() to clear the RAM of all the images we have loaded with the GD library.

imagejpeg($image);  
imagedestroy($image);  
imagedestroy($watermark);

There you have it! You can now watermark any image on your Web server dynamically using one of the deadliest combinations of free software: PHP and the GD image library. The complete watermarking script is below. Enjoy!

<?php  

header('content-type: image/jpeg');  

$watermark = imagecreatefrompng('watermark.png');  
$watermark_width = imagesx($watermark);  
$watermark_height = imagesy($watermark);  
$image = imagecreatetruecolor($watermark_width, $watermark_height);  
$image = imagecreatefromjpeg($_GET['src']);  
$size = getimagesize($_GET['src']);  
$dest_x = $size[0] - $watermark_width - 5;  
$dest_y = $size[1] - $watermark_height - 5;  
imagecopymerge($image, $watermark, $dest_x, $dest_y, 0, 0, $watermark_width, $watermark_height, 100);  
imagejpeg($image);  
imagedestroy($image);  
imagedestroy($watermark);  

?>

Frequently Asked Questions (FAQs) about Watermarking Images with PHP

How can I add a watermark to an image using PHP without losing the image quality?

To add a watermark to an image without losing the image quality, you need to use the PHP GD library. First, load the image and the watermark using the imagecreatefromjpeg() function. Then, get the image dimensions using the imagesx() and imagesy() functions. After that, use the imagecopy() function to merge the watermark and the image. Finally, output the image using the imagejpeg() function. Remember to use the imagedestroy() function to free up memory.

Can I add a watermark to PNG images using PHP?

Yes, you can add a watermark to PNG images using PHP. The process is similar to adding a watermark to JPEG images. However, you need to use the imagecreatefrompng() function to load the PNG image and the imagepng() function to output the image.

How can I position the watermark at the center of the image?

To position the watermark at the center of the image, you need to calculate the center coordinates of the image and the watermark. Subtract half of the watermark’s width and height from the image’s width and height, respectively. Then, use these coordinates as the destination coordinates in the imagecopy() function.

Can I add a text watermark to an image using PHP?

Yes, you can add a text watermark to an image using PHP. Use the imagettftext() function to add the text. This function requires the font size, angle, coordinates, color, and font path as parameters.

How can I make the watermark transparent?

To make the watermark transparent, use the imagecolorallocatealpha() function to create a transparent color. Then, use this color as the third parameter in the imagecopy() function.

Can I add a watermark to multiple images at once?

Yes, you can add a watermark to multiple images at once using PHP. You need to create a loop that goes through each image and applies the watermark.

How can I resize the watermark to fit the image?

To resize the watermark to fit the image, use the imagescale() function. This function requires the watermark and the new width as parameters. It automatically calculates the height to maintain the aspect ratio.

Can I add a watermark to an image uploaded by a user?

Yes, you can add a watermark to an image uploaded by a user. Use the move_uploaded_file() function to move the uploaded file to a temporary directory. Then, load the image from this directory and add the watermark.

How can I save the watermarked image to a file?

To save the watermarked image to a file, use the imagejpeg() or imagepng() function. Instead of outputting the image to the browser, provide a filename as the second parameter.

Can I add a watermark to an image without using the GD library?

Yes, you can add a watermark to an image without using the GD library. You can use the Imagick extension, which provides more advanced image manipulation features. However, this extension is not enabled by default in PHP, so you may need to install it manually.

Brock FergusonBrock Ferguson
View Author

Brock Ferguson is a young entrepreneur and owner of Caribou CMS, a powerful tool designed to help users start their own subscription web sites in days.

Share this article
Read Next
Get the freshest news and resources for developers, designers and digital creators in your inbox each week