Watermark uploaded Image with PHP

Written by Saran on August 6, 2014, Updated August 8, 2014

Watermarking is a popular method to protect digital photos from being copied by the picture thieves on the net. Using PHP we can do the same. Here we use a transparent PNG image as Watermark template, we then merge it with image to create a permanent watermark.

In most scenarios people want to resize uploaded image using HTML form and then watermark it on the fly. So in this article, we will do the same. We upload an image, resize it and then watermark it with our PNG file.

Picture : Thomas Leth-Olsen
If you look at my previous resize snippet, you’ll realize that I have made a slight modification to the code. This snippet typically does the same thing, it resizes uploaded image. But after modification, now it adds a watermark to all resized images. Let’s create an upload page using HTML below.

1
2
3
4

Using PHP Imagecopy()

The slight modification in previous PHP snippet I talked about above is that I have added PHP imagecopy() in this snippet. What it actually does is that it copies defined portion of source image to the destination image. So, basically we copy and merge PNG watermark image with the uploaded image.

Take a look at example below, the code first calculates center position of watermark image using width and height of destination and watermark images, and then using PHP imagecopy() it merges watermark image to the destination image.

1
2
3
4
5
6
7
8
9
10
11
12

//path to destination image
$destination_image = imagecreatefromjpeg('PATH/TO/DESTINATION/JPEG/FILE');

//path to watermark image
$watermark = imagecreatefrompng('PATH/TO/WATERMARK/PNG/FILE');

//calculate center position of watermark image
$watermark_left = (DST_IMAGE_WIDTH/2)-(WATERMARK_WIDTH/2); //watermark left
$watermark_bottom = (DST_IMAGE_HEIGHT/2)-(WATERMARK_HEIGHT/2); //watermark bottom

//use PHP imagecopy() to merge two images.
imagecopy($destination_image, $watermark, $watermark_left, $watermark_bottom, 0, 0, WATERMARK_WIDTH, WATERMARK_HEIGHT); //merge image

Complete snippet (Re-size and Watermark)

If you are clear on the example above, take a look at the complete PHP code below, we call PHP imagecopy() function after the image is resized, but before saving the image.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67

if(isset($_FILES['image_file']))
{
$max_size = 800; //max image size in Pixels
$destination_folder = 'path/to/upload/folder';
$watermark_png_file = 'watermark.png'; //path to watermark image

$image_name = $_FILES['image_file']['name']; //file name
$image_size = $_FILES['image_file']['size']; //file size
$image_temp = $_FILES['image_file']['tmp_name']; //file temp
$image_type = $_FILES['image_file']['type']; //file type

switch(strtolower($image_type)){ //determine uploaded image type
//Create new image from file
case 'image/png':
$image_resource = imagecreatefrompng($image_temp);
break;
case 'image/gif':
$image_resource = imagecreatefromgif($image_temp);
break;
case 'image/jpeg': case 'image/pjpeg':
$image_resource = imagecreatefromjpeg($image_temp);
break;
default:
$image_resource = false;
}

if($image_resource){
//Copy and resize part of an image with resampling
list($img_width, $img_height) = getimagesize($image_temp);

//Construct a proportional size of new image
$image_scale = min($max_size / $img_width, $max_size / $img_height);
$new_image_width = ceil($image_scale * $img_width);
$new_image_height = ceil($image_scale * $img_height);
$new_canvas = imagecreatetruecolor($new_image_width , $new_image_height);

//Resize image with new height and width
if(imagecopyresampled($new_canvas, $image_resource , 0, 0, 0, 0, $new_image_width, $new_image_height, $img_width, $img_height))
{

if(!is_dir($destination_folder)){
mkdir($destination_folder);//create dir if it doesn't exist
}

//calculate center position of watermark image
$watermark_left = ($new_image_width/2)-(300/2); //watermark left
$watermark_bottom = ($new_image_height/2)-(100/2); //watermark bottom

$watermark = imagecreatefrompng($watermark_png_file); //watermark image

//use PHP imagecopy() to merge two images.
imagecopy($new_canvas, $watermark, $watermark_left, $watermark_bottom, 0, 0, 300, 100); //merge image

//output image direcly on the browser.
header('Content-Type: image/jpeg');
imagejpeg($new_canvas, NULL , 90);

//Or Save image to the folder
//imagejpeg($new_canvas, $destination_folder.'/'.$image_name , 90);

//free up memory
imagedestroy($new_canvas);
imagedestroy($image_resource);
die();
}
}
}

You can download example files by clicking download button below, and play a bit with it on your server, all the best!
Download

11 Comments Add Comment

Taha January 29, 2018 at 11:18 am
Nice,tutorial sir, well explain, and really helpful.
Thank you sir.
Reply
türküindir January 15, 2017 at 11:13 pm
If you upload a square picture, the result is magnificent.
Reply
Allan July 12, 2016 at 8:32 pm
I used your upload with progress bar script to make an upload page for a daily photo system.

https://www.sanwebe.com/downloads/10-ajax-upload-with-progressbar

But I want to add this watermark code in there, but don’t quite see where I should put it in the code for that upload script and what changes I would need to add.

Any advice where to put and if I need to change any other parts of the script?
Reply
Blogger Tawsif June 1, 2016 at 4:14 pm
Best! Thanks Man :)
Reply
Michael Heitz May 6, 2016 at 11:24 pm
Thnx man. You very best….I searched for a long time this is what
Reply
Sajjad March 26, 2016 at 9:11 pm
Great tutorial sir, Its helpful for me. :)
Reply
Stefan September 8, 2015 at 6:10 pm
Need some help.
I would like to deploy your code (Watermark Image uploaded with PHP). I want the upload images with WATERMARK.
This is my code:
function UpdateValuesJoc($date_db,$file){
if(!empty($file[‘fisier’][‘name’])){
$uploaddir = $_SERVER[‘DOCUMENT_ROOT’].”/files/img/”.$file[“fisier”][“name”];
move_uploaded_file($file[‘fisier’][‘tmp_name’], $uploaddir);

$fille = $_SERVER[‘DOCUMENT_ROOT’].”/files/img/”.$file[“fisier”][“name”];

$nume = substr(str_replace(” “,”-“,$file[“fisier”][“name”]), 0, strrpos($file[“fisier”][“name”], ‘.’));
$extensie = strrchr($file[“fisier”][“name”], ‘.’);

$rename_fille = $_SERVER[‘DOCUMENT_ROOT’].”/files/img/”.$date_db[‘id’].’_’.$nume.$extensie;
rename($fille,$rename_fille);
$fisier = $date_db[‘id’].’_’.$nume.$extensie;
$sql = mysql_query(“UPDATE `jocuri` SET `fisier` = ‘”.$fisier.”‘ WHERE `joc_id` = ‘”.$date_db[‘id’].”‘”);
}
Reply
nitin June 30, 2015 at 12:14 pm
thnk u man
Reply
Patrick March 27, 2015 at 1:04 am
Where do those “image…” functions come from? Do they depend on any libraries or something?

Thanks.
Reply
Ktn Thkkr October 26, 2014 at 5:30 pm
Hello Dude,
I had seen your blog, good job,
but this script is not working properly, i had tried it, it is not returning image,

Thanks,
Hope you reply as early as possible,
Reply
- Ayodele August 1, 2015 at 3:43 pm
  Its ok dudu.