{"id":21372,"date":"2016-04-27T14:05:04","date_gmt":"2016-04-27T14:05:04","guid":{"rendered":"http:\/\/how_to_use_conditions_to_dynamically_manipulate_images"},"modified":"2024-06-04T15:45:01","modified_gmt":"2024-06-04T22:45:01","slug":"how_to_use_conditions_to_dynamically_manipulate_images","status":"publish","type":"post","link":"https:\/\/cloudinary.com\/blog\/how_to_use_conditions_to_dynamically_manipulate_images","title":{"rendered":"How to use conditions to dynamically transform images"},"content":{"rendered":"

It\u2019s great to have the capability to transform images on the fly by using dynamic URLs to customize the images to fit the graphic design of your site or mobile application. However, what if you want to transform an image depending on a specific image characteristic (like its width or aspect ratio) or its contents (does it contain a face?). What you need is a way to apply a transformation to an image only if a specific condition is met. Take for example a situation where you have allocated space on your page for a user uploaded image with a width and height of 200 pixels. Furthermore, if the image contains a face you would like to zoom in and focus on the face itself, otherwise you would like to fit the entire image into the available space:<\/p>\n

\n Loading code examples<\/span>\n <\/cld-code-widget>\n\"Original<\/a>\"right<\/a>\"An<\/a><\/p>\n

\n Loading code examples<\/span>\n <\/cld-code-widget><\/p>\n

\"Original<\/a>\"right<\/a><\/p>\n

\"An<\/a><\/p>\n

As can be seen in the example images above, a different transformation is applied to the image depending on whether the original image contains a face.<\/p>\n

Making sure your site looks good can be challenging if you don\u2019t know in advance what kind of images your users (or editors) upload. The images will likely vary in aspect ratios, dimensions, and other characteristics, and the graphic design of your site probably requires different image dimensions and effects for different kinds of image. For example:<\/p>\n