by Jeff Eaton on August 5, 2013 // Short URL

Module Monday: ImageField Focus

Give content editors more control over image cropping

Drupal image fields allow content editors to upload photos and pictures without tedious manual cropping and scaling. One posted, images are piped through a series of automatic cropping and scaling presets, ensuring everything is fast and consistent. Unfortunately, all that automation can be a problem when content creators do need to tweak how an image will appear at different sizes. When that's the case, the Imagefield Focus module can help.

Picture of the module being set up

Once installed, ImageField focus gives site builders a new option when setting up the rules for those automatically-generated image derivatives. Imagefield Focus adds "smart" versions of the standard Scale and Crop actions that take into account an image's "focus point" -- a portion of the image that should always be visible, even when it's scaled down and trimmed to fit other dimensions. Editors can specify that focus region when uploading an image using a simple Javascript widget; if no focus is specified, the normal cropping and scaling behaviors take over.

Picture of the module in action

Although it doesn't give editors explicit control over the precise appearance of every version of an uploaded image, Imagefield Focus does the next best thing. It's a quick and easy addition to most sites, and can dramatically improve the quality of small thumbnails when used judiciously.

Jeff Eaton

Senior Digital Strategist

Want Jeff Eaton to speak at your event? Contact us with the details and we’ll be in touch soon.

Comments

Rob

Very useful module. @BWPanda,

Very useful module. @BWPanda, ManualCrop looks nicely done too!

Uh, which game is that in the screenshot. Looks fun.

Reply

eaton

Which game?

The recently-released Kickstarter-funded Shadowrun Returns. It's pretty fantastic. ;-)

Reply

Dylan James

Try EPSA crop

EPSA crop provides the option to crop the image for each location where it may be used, ie. for each image format allowed for the field in question.

Reply

Stephanie Barone

A very helpful module for us

We are using this module on our new D7 main hospital website www.faxtonstlukes.com that we just rolled out a few weeks ago. It is a big help for us to keep our Find a Doctor thumbnail images from "having their heads cut off" on the list view. It is something we've wanted the content editors to have the ability to do for a long time. A great module!

Reply

Jason Pamental

Responsive Images!

Combined with the Adaptive Images module and you've got a pretty awesome solution for responsive images too! On smaller screens it would pick up the image style (and crop) appropriate for the device. That's pretty sweet!

Reply