Help Your Customers Crop The Perfect Profile Picture
Using the new CropGuide circular crop overlay and masking options we can help our customers crop circular profile pictures.
A circular crop guide makes it easier to get a sense of the end result and the final look of the profile picture resulting in increased quality of user generated content.
Showing A Circular Crop Overlay
These two new options in the CropGuide dashboard configure the overlay and masking of the image cropper.
To crop circular profile pictures we set the Guide option to Circle. The image cropper will now show a circular crop guide on top of the crop tool.
To make sure the circle stays a circle we set the Crop aspect ratio to 1 forcing a square crop.
Masking The Output Image
We can also mask the output image.
The Guide option will only show a visual guide, it will not alter the image data. To create a circular output image we need to set the Mask option to Circle.
In the animation below we can see the circular crop guide. When the editing has finished the editor applies a circular mask to the result.
CropGuide works with any any file upload field.
Add the CropGuide script tag to the page that shows your profile picture upload form and CropGuide will automagically crop images added to the profile picture field.
