CancelImage Upload

How to resize an image to create a thumbnail with using PHP GD Library Functions

The ability to resize images, and through doing so generating thumbnails, is of great importance to any interactive website where the users can themselves upload images. This is mainly because your average user is completely unaware of how big the image is that they are uploading. It could be 200 x 150 pixels, or 2500 x 1600, to most the dimensions would not mean much.

As website developers however we have no choice but to be highly aware of the impact of larger images on our download speeds. This is why if possible an uploaded image should be shrunk down, first into a more manageable size along the 600 pixel width dimension, and then secondly for pages containing smaller pictures (such as profile images) an even smaller format, of say 200 X 150 pixels.

From a pure GD library perspective this task can be accomplished with the help of four functions. They do pretty much what the names indicate, from initialising the pictures to creating a resized color copy, to actually brining the image into existence as a jpg:

ImageCreateFromJPEG();

ImageCreateTrueColor();

ImageCopyResized();

imagejpeg();

What is more interesting however is some of the coding that needs to be placed around the image. For instance at first the original image location and a target location for the thumbnail to be need to be provided, along with the new maximum dimension upon which the resize is based.

Most important of all we need to first find out whether or not the image has a horizontal or vertical format. Here is an if statement to help us in this regard:

$imageDetails = getimagesize($thumb);

$originalWidth = $imageDetails[0];

$originalHeight = $imageDetails[1];

if($originalWidth > $originalHeight)
{

      $thumbHeight = $height;

      $thumbWidth = ($originalWidth/($originalHeight/$thumbHeight));

}
else
{

      $thumbWidth = $width;

      $thumbHeight = ($originalHeight/($originalWidth/$thumbWidth));

}

Depending on the outlay of the picture the above piece of code calculates the exact distance of the missing dimension. If you add this to the above displayed GD functions you get something along the lines of the following code:

<?php

imageResize('file.jpg', 'images/', 200, 300);

echo "<img src=\"images/thumbs/file.jpg\">";

function imageResize($file, $path, $height, $width)
{

      $target = $path.'/thumbs/';

      $handle = opendir($path);

      if($file != "." && $file != ".." && !is_dir($path.$file))
      {

            $thumb = $path.$file;

            $imageDetails = getimagesize($thumb);

            $originalWidth = $imageDetails[0];

            $originalHeight = $imageDetails[1];

            if($originalWidth > $originalHeight)
            {

                  $thumbHeight = $height;

                  $thumbWidth = ($originalWidth/($originalHeight/$thumbHeight));

            }
            else
            {

                  $thumbWidth = $width;

                  $thumbHeight = ($originalHeight/($originalWidth/$thumbWidth));

            }

            $originalImage = ImageCreateFromJPEG($thumb);

            $thumbImage = ImageCreateTrueColor($thumbWidth, $thumbHeight);

            ImageCopyResized($thumbImage, $originalImage, 0, 0, 0, 0, $thumbWidth,
            $thumbHeight, $originalWidth, $originalHeight);

            $filename = $file;

            imagejpeg($thumbImage, $target.$filename, 100);

      }

      closedir($handle);

}

?>


Login
Want to leave a comment?

No problem. Just enter your email and password below.


register | home | reminder

myDesignTool Networking • www.mydesigntool.cominfo@mydesigntool.com