Crop images in PHP (video tutorial)

Overview

Learn how to programmatically crop images in your PHP applications using Cloudinary's AI-powered gravity settings. Instead of manually cropping images one by one, this tutorial shows you how to automate the process while ensuring that the important parts of your images remain in focus.

Video tutorial

Tutorial contents

This tutorial presents the following topics. Click a timestamp to jump to that part of the video.

Introducing the problem

0:00	Manually cropping batches of images is tedious, if not impossible, even with the best of tools. It's better to use automatic smart cropping.

The Cloudinary solution

0:07	Crop your images programmatically in your PHP app with Cloudinary and rest assured that the important parts of the image always remain in focus using intelligent gravity settings.

Getting started with the demo

0:20	You should have a sample image in your product environment. Find the sample image by its public ID, cld-sample.

Viewing the image in a browser

0:30	Copy the image URL and open it in a new browser window to see the image before applying transformations. Note that the original image is big. Cropping and resizing the image also optimizes it to save bandwidth.

Applying automatic cropping

0:44

This tutorial assumes your app is already configured with the PHP SDK. If you still need to configure your app, see Configure the PHP SDK. To resize your images in your PHP app, import the library with use Cloudinary\Transformation\Resize;, reference the image with $cld->image('cld-sample'), and apply the resize transformation with ->resize(Resize::scale()->width(600)). Store the transformation in the $scaleURL variable, then print the URL.

Run the code and view the image

1:16	Run the code and open the URL in a new browser window. The browser displays the resized image.

Add crop

1:22	To fit the image in a bounding box with a specific aspect ratio, update the code to add a height in addition to width, and change the function from scale to crop.

Run the code and check the image

1:38	Run the code and open the URL in a new browser window. This is a blind crop which cuts out important parts of the image. We need to add automatic gravity to rely on the programmatic crop.

Smart crop

1:53	Automatic gravity (gravity(Gravity::auto) in the SDK and g_auto in the URL) uses deep learning and saliency algorithms to identify and retain the most important object when cropping an image. To add this feature, import the library with use Cloudinary\Transformation\Gravity;, change Resize::crop() to Resize::auto(), and add the gravity(Gravity::auto) parameter.

Smart cropping allows you to crop programmatically in bulk

2:13	Run the code and open the URL in a new browser window. The crop works automatically, giving confidence that your images look good when cropped programmatically.

Auto crop around the face

2:27	To crop around the face, such as when creating a portrait thumbnail, use the face parameter.

Batch crop

2:51	To make the most of this feature, save time by automatically cropping batches of images at once. Add an array of public IDs and loop through, applying gravity(Gravity::auto()) to each one.

Keep learning

If you like this, you might also like...

 

 

Check out the Cloudinary Academy for free self-paced Cloudinary courses on a variety of developer or DAM topics, or register for formal instructor-led courses, either virtual or on-site.