Skip to content

Image Cropping

Simon Yohannes edited this page Nov 30, 2019 · 4 revisions

Puck supports image cropping out of the box if you use the PuckImage class in your ViewModels. the first thing you will need to do though, is set up your crop sizes and crop aliases.

Setting up your crop sizes

you will need to visit the "Settings -> Editor Parameters", page in the backoffice and set editor settings of type PuckCropsEditorSettings against the BaseModel ViewModel type. leave the property option set to None. in the edit screen, set your alias for the crop, for example "GalleryImage" or "HeroImage" and the width and the height.

you will then be able to use the Crops tab when editing a PuckImage on the content editing screen.

Retrieving crops

PuckImage has a method GetCropUrl(string cropAlias) which returns the image url of your crop so this is what you would use in your templates to get your image crops.