Silverstripe FocusPoint

Smarter Image Cropping for SilverStripe

View project onGitHub


The goal of this module is to provide some control over automatic image cropping in SilverStripe.

Problem: SilverStripe crops all images from the centre. If the subject is off-centre, it may be cropped out.

Solution: FocusPoint allows you to tag the subject in an image and ensures it is not lost during cropping.


SilverStripe 3.1


Manually: Download, place the folder in your project root and run a dev/build?flush=1.

Composer/Packagist: Add "jonom/focuspoint" to your requirements.


In templates: Use just like CroppedImage, but use CroppedFocusedImage instead.

In the CMS: When you edit an image in the CMS there should be an extra 'Focus Point' field. Click on the subject of the image to set the focus area and save the image.

Responsive cropping: see an example of how to set up a full-screen responsively-cropped image here. Demo files are included in the jquery-focuspoint folder. Note: this is an early proof of concept, I may move this to a separate project in the future.

To Do

  • Override CroppedImage() instead of adding new method
  • ImageMagick support (maybe already works - need to test)

Maintainer contact