Are you looking for how to resize images in PHP? While working on the web application, you need to create different thumbnails of the original image. The thumbnail is the resized version of your original image. In this article, I show you how to upload and resize images in PHP.
Why Should We Resize Images?
On the website, there are several scenarios where you want to display a short version of the large image. A popular example is the Image Gallery. In the gallery, we used to display a list of small images. When a user clicks on the small image it will open the large image in the pop-up. Another example is displaying related articles where we show small images along with the title and description of a post.
In such cases, we require to generate a small image(thumbnail) using the original image. A small thumbnail reduces the size of your pages. As you are using a smaller image, the browser requires low bandwidth for loading the image. It will add some benefits to the website. Some of them are:
- Improves server performance
- Reduce bandwidth
- Improve page speed
That being said, let’s take a look at how to resize the image in PHP.
Getting Started
Intervention Image is an open-source library that acts as an image resizer tool. Under the hood, the library uses GD Library and Imagick for image processing and manipulation.
For getting started, you need to install the Intervention Image library into your application. I recommend using Composer for the installation of a library.
Open the terminal in your project root directory and run the command:
composer require intervention/image
After installing the library, you must include its environment in your application. For this, add below two lines to the PHP file.
<?php
require 'vendor/autoload.php';
use Intervention\Image\ImageManagerStatic as Image;
In order to upload and resize the image, create the HTML form where one can browse the image and hit the submit button. Use the below HTML which contains the file input and a submit button.
<form method="post" enctype="multipart/form-data">
<p><input type="file" name="image" /></p>
<input type="submit" name="submit" value="Submit" />
</form>
Resize Image in PHP Using Intervention Image
We have installed the library and created a form. Next, we have to upload and resize the image on the fly. I am going to create two directories uploads
and thumbnails
. In the uploads
folder, we will store the original image. The thumbnail version of the image will store inside thumbnails
directory.
Use the below code which will store the original and thumbnail version of the image into the uploads
and thumbnails
directories respectively.
<?php
require 'vendor/autoload.php';
use Intervention\Image\ImageManagerStatic as Image;
if (isset($_POST['submit'])) {
$allowed_mime_type = array('image/jpg', 'image/jpeg', 'image/png', 'image/gif');
if (in_array($_FILES['image']['type'], $allowed_mime_type)) {
if ( !file_exists('uploads') ) {
mkdir('uploads', 0755);
}
$filename = time().'_'.$_FILES['image']['name'];
$filepath = 'uploads/'. $filename;
move_uploaded_file($_FILES['image']['tmp_name'], $filepath);
if ( !file_exists('uploads/thumbnails') ) {
mkdir('uploads/thumbnails', 0755);
}
$thumbnailpath = 'uploads/thumbnails/'. $filename;
$img = Image::make($filepath);
$img->resize(300, null, function ($constraint) {
$constraint->aspectRatio();
});
$img->save($thumbnailpath);
echo "Image uploaded successfully.";
}
}
In the above code, I passed the width as 300 and resized the image by maintaining their aspect ratio. You can pass the width value as per your requirement. Keeping the aspect ratio is recommended when resizing the image. Using an aspect ratio, the image will not stretch. However, if you are looking for a hard crop then replace the below lines
$img->resize(300, null, function ($constraint) {
$constraint->aspectRatio();
});
$img->save($thumbnailpath);
With
$img->resize(300, 150)->save($thumbnailpath);
Conclusion
In this tutorial, we studied how to resize images by maintaining their aspect ratio. We also wrote a code that will hard crop the image. The Intervention Image library provides a few more options for a resize method. You may read more about it in their documentation.
Related Articles
- Resize Image In Laravel Using Intervention Image Library
- Resize Image In PHP Using TinyPNG
- Drag And Drop File Upload Using JavaScript And PHP
If you liked this article, then please subscribe to our YouTube Channel for video tutorials.
Free Online Image Batch Processor – Create Watermarks for Photos Online, Easily crop, Bulk image resizer, and edit your images online for FREE at Picinez.com