PHP Upload and Resize Image

Many times when you upload a image somewhere you want to resize it to different dimensions based off of a maximum width or height. Here is a simple script that does this for you, using a HTML form and a PHP script. We start with the PHP script that will run if our $_GET['do'] is set to “upload.” Then we include the HTML form that has three inputs (max width, max height, image file).

Use the Upload and Resize Demo Here!

Download This Script!

Here is the PHP for our function – generate_resized_image() – which will take the given image file, create a new file on our server, and then copy the uploaded image to our local image file with the new width and height:

<?php
// index.php
function generate_resized_image(){
$max_dimension = 800; // Max new width or height, can not exceed this value.
$dir = "./images/"; // Directory to save resized image. (Include a trailing slash - /)
// Collect the post variables.
$postvars = array(
"image"    => trim($_FILES["image"]["name"]),
"image_tmp"    => $_FILES["image"]["tmp_name"],
"image_size"    => (int)$_FILES["image"]["size"],
"image_max_width"    => (int)$_POST["image_max_width"],
"image_max_height"   => (int)$_POST["image_max_height"]
);
// Array of valid extensions.
$valid_exts = array("jpg","jpeg","gif","png");
// Select the extension from the file.
$ext = end(explode(".",strtolower(trim($_FILES["image"]["name"]))));
// Check not larger than 175kb.
if($postvars["image_size"] <= 179200){
// Check is valid extension.
if(in_array($ext,$valid_exts)){
if($ext == "jpg" || $ext == "jpeg"){
$image = imagecreatefromjpeg($postvars["image_tmp"]);
}
else if($ext == "gif"){
$image = imagecreatefromgif($postvars["image_tmp"]);
}
else if($ext == "png"){
$image = imagecreatefrompng($postvars["image_tmp"]);
}
// Grab the width and height of the image.
list($width,$height) = getimagesize($postvars["image_tmp"]);
// If the max width input is greater than max height we base the new image off of that, otherwise we
// use the max height input.
// We get the other dimension by multiplying the quotient of the new width or height divided by
// the old width or height.
if($postvars["image_max_width"] > $postvars["image_max_height"]){
if($postvars["image_max_width"] > $max_dimension){
$newwidth = $max_dimension;
} else {
$newwidth = $postvars["image_max_width"];
}
$newheight = ($newwidth / $width) * $height;
} else {
if($postvars["image_max_height"] > $max_dimension){
$newheight = $max_dimension;
} else {
$newheight = $postvars["image_max_height"];
}
$newwidth = ($newheight / $height) * $width;
}
// Create temporary image file.
$tmp = imagecreatetruecolor($newwidth,$newheight);
// Copy the image to one with the new width and height.
imagecopyresampled($tmp,$image,0,0,0,0,$newwidth,$newheight,$width,$height);
// Create random 4 digit number for filename.
$rand = rand(1000,9999);
$filename = $dir.$rand.$postvars["image"];
// Create image file with 100% quality.
imagejpeg($tmp,$filename,100);
return "<strong>Image Preview:</strong><br/>
<img src=\"".$filename."\" border=\"0\" title=\"Resized  Image Preview\" style=\"padding: 4px 0px 4px 0px;background-color:#e0e0e0\" /><br/>
Resized image successfully generated. <a href=\"".$filename."\" target=\"_blank\" name=\"Download your resized image now!\">Click here to download your image.</a>";
imagedestroy($image);
imagedestroy($tmp);
} else {
return "File size too large. Max allowed file size is 175kb.";
}
} else {
return "Invalid file type. You must upload an image file. (jpg, jpeg, gif, png).";
}
}
?>

This function you can define in your header PHP files along with other functions or where ever you would like, so long as it is defined before the call of the function itself.

Here is the HTML for our form to submit the image file and the new dimensions:

HTML Form   
<form action="./index.php?do=upload" method="post" enctype="multipart/form-data">
<table width="100%" align="center" border="0" cellpadding="2" cellspacing="0">
<tr>
<td align="left" width="100">
New Width:</td>
<td align="left"><input name="image_max_width" style="width: 120px" type="text" maxlength="4" /> px.</td>
</tr>
<tr><td colspan="2"><strong>OR</strong></td></tr>
<tr>
<td align="left">
New Height:</td>
<td align="left"><input type="text" name="image_max_height" style="width: 120px" maxlength="4" /> px.</td>
</tr>
<tr>
<td align="left">
Image:</td>
<td align="left"><input type="file" name="image" size="40" /></td></tr>
<tr>
<td align="left" colspan="2">
<ol style="margin:0;padding:3px 0px 3px 15px">
<li>Max file size: 175 KB.</li>
<li>Allowed extensions: jpg, jpeg, gif, png.</li>
<li>Max Dimension: <em>800</em>px.</li>
</ol>
</tr>
<tr>
<td align="left" colspan="2">
<input type="submit" name="submit" value="Submit!" style="font: 10pt verdana" />
</td>
</tr>
</table>
</form>

This will create a form that looks like this:

Max Width: px.
Max Height: px.
Image:
  1. Max file size: 175 KB
  2. Allowed extensions: jpg, jpeg, gif, png.
  3. Max Dimension: 800px.

 

Okay, so now we have our PHP function defined, included and our HTML contains this form submitting the image file and its new dimensions. All we need now is a short code of PHP to check our GET values, particularly do for the value upload. This tells us the form was submitted and we can start checking it for values, and creating our re-sized image.

Here is the PHP which will appear below the HTML form to show our re-sized image once the form is submitted:

<?php

if(isset($_GET['do']) && $_GET['do'] == "upload")
{

$upload_and_resize = generate_resized_image();
echo '<div id="upload">'. $upload_and_resize. '</div>';

}

?>

This post was written by

Brian – who has written posts on bgallz.org.

Email  • Facebook  • Twitter

11

Filed Under: FeaturedPHPScriptsTutorialsWeb Programming

Tags:

RSSComments (30)

Leave a Reply | Trackback URL

  1. mitul Bhadeshiya says:

    Thanks its work…. awesome… :)

  2. This script upload and resize image. Select your image and image will resize to 200×200 px and 50×50 px.
    http://www.mydraft.net/product.php?id=3

  3. Edmundo Dante says:

    is a poor **** this, we need is automatic, no one for one, is very estupid this script.

    • Brian says:

      This script you are linking to costs money… Why pay money for something you can make on your own for free?

      That is what this post is all about. A FREE upload and resize script.

  4. mountainbike says:

    Hey, I attempted to email you pertaining to this post but aren?t able to reach you. Please e-mail me when get a moment. Thanks.

  5. Meagan says:

    Thanks so much for sharing all of the awesome information! Looking forward to checking out more.

  6. Praca says:

    I am a frequent reader of your blog posts. I liked the recent one and other posts on your blog so much that I have subscribed to the blog’s RSS feed in Thunderbird. Even thinking of stealing some ideas and put them to work. Keep all the good work going by posting more informative posts. Thank you. Time well spent on this post.

  7. Jason says:

    Thank you for sharing these scripts!

Leave a Reply




If you want a picture to show with your comment, go get a Gravatar.