Cropping an image

Sometimes your content or page design might dictate that your image should be square or a certain size. ProcessWire enables site editors to crop images within the CMS as follows:

1. Add your image to the appropriate field
2. Mouse-over your image and an Edit option appaears.
3. Click the image to reveal a panel containing a Crop button
4. Click the Crop button to trigger the Cropping popup with a number of options
5. Click the Crop icon and the image will display a preview of the cropping area with the remainder of the image greyed out.
6. To resize the crop you can enter your pixel dimensions in the Width and Height fields and hit Enter
7. To move the crop to a different area of the image you can click its center and reposition the crop area
8. Click Apply to commit your crop to the Image
9. Once complete, click the Save and Replace button
10. You will be returned to the page edit mode. Don't forget to Save your page to see the changes on the front end of the site.