Watermark processing on images using PHP and GD

Watermark processing on images using PHP and GD

Today is interesting tutorial for PHP. I will show you how to use GD library. And, main task today is adding watermark to image and generate result as PNG image into browser. We will using PHP and GD library. This is nice library to work with images at server side. Also (as additional tasks) I will draw little frame over image and will draw some text. Between, you can use this method (of adding watermarks in realtime) to protect original photos.

Live Demo

download in package

Now – download the source files and lets start coding !

Step 1. PHP

Yes, today we will start directly from PHP step. Just because we don`t need anything – just generate result with PHP.

index.php

<?php
    if (! extension_loaded('gd')) { // small check - are GD installed or not
        echo 'GD not installed, please install';
        exit;
    }

    $sOrigImg = "pic1.jpg";
    $sWmImg = "watermark.png";

    $aImgInfo = getimagesize($sOrigImg);
    $aWmImgInfo = getimagesize($sWmImg);
    if (is_array($aImgInfo) && count($aImgInfo)) {
        header ("Content-type: image/png");

        $iSrcWidth = $aImgInfo[0];
        $iSrcHeight = $aImgInfo[1];

        $iFrameSize = 15;

        $rImage = imagecreatetruecolor($iSrcWidth+$iFrameSize*2, $iSrcHeight+$iFrameSize*2); // creating new true color image
        $rSrcImage = imagecreatefromjpeg($sOrigImg); //  creating source image resource
        $rWmImage = imagecreatefrompng($sWmImg); //  creating watermark image resource

        $aGrid[1] = imagecolorallocate($rImage, 130, 130, 130); // define colors for rectangular frame
        $aGrid[2] = imagecolorallocate($rImage, 150, 150, 150);
        $aGrid[3] = imagecolorallocate($rImage, 170, 170, 170);
        $aGrid[4] = imagecolorallocate($rImage, 190, 190, 190);
        $aGrid[5] = imagecolorallocate($rImage, 210, 210, 210);
        for ($i=1; $i<=5; $i++) { // our little frame will contain 5 rectangulars to emulate gradient
            imagefilledrectangle($rImage, $i*3, $i*3, ($iSrcWidth+$iFrameSize*2)-$i*3, ($iSrcHeight+$iFrameSize*2)-$i*3, $aGrid[$i]); // drawing filled rectangle
        } 

        imagecopy($rImage, $rSrcImage, $iFrameSize, $iFrameSize, 0, 0, $iSrcWidth, $iSrcHeight); // copy image to main resource image

        if (is_array($aWmImgInfo) && count($aWmImgInfo)) {
            imagecopy($rImage, $rWmImage, $iSrcWidth-$aWmImgInfo[0], $iFrameSize, 0, 0, $aWmImgInfo[0], $aWmImgInfo[1]); // copy watermark image to main resource image
        }

        $iTextColor = imagecolorallocate($rImage, 255, 255, 255); // defining color for text
        $sIP = $_SERVER['REMOTE_ADDR']; // define guest ip
        imagestring($rImage, 5, $iFrameSize*2, $iFrameSize*2, "Hello guest from {$sIP}, {$sOrigImg} - ({$iSrcWidth} x {$iSrcHeight})", $iTextColor); // draw text

        imagepng($rImage); // output as png image
    } else {
        echo 'wrong image';
        exit;
    }
?>

I added my comments quite anywhere, so I hope that you don`t will have any difficulties with my code. Shortly – firstly we checking source image info, if not empty – continue, then preparing new resource image with GD, after reading source image, after drawing our source image to prepared resource object. Then we applying watermark image (if its present), then determination visitor`s IP, and drawing some text on our resource object. In result – we drawing our resource object into browser as PNG image. Thats all.

Live Demo

download in archive

Conclusion

I hope that today’s article was very interesting for you again. Welcome back our friends for new tutorials. Good luck in your work!

Related Articles

How to Resize images on Server Side

Creating a Smooth Curve Graphs with PHP and GD

Cropping images in runtime using Jcrop (jQuery)