Responsive Image Editor

With the release of the Image Editor tool you can now edit the images used on your websites pages directly through the editor whilst managing your pages.

To Edit Images In Your Website:

1. Hover your mouse over an image once its added into a content page. This will bring up the standard options "Move", "Edit Property", "Copy", "Delete" and now a new option "Edit Image".
2. Click the "Edit Image" button, this will load the new Image Editor and display the parent editing options "Crop", "Re-size", "Save" and "Exit"
3. Once all edits have been applied and there's no further editing required click the "Save" button, this will save all the applied updates and create a new image for use on your page, note that the image will also save an updated version within the "Image and File Manager" for use on other pages.

To Crop Images In Your Website:

1. Select the "Crop" image option, this will bring up the cropping tools listed below:
   
   - Crop Shape: Allows the image to be cropped as a square or Circle
   - Lock Aspect Ratio: locks the aspect ratio to 16:9, 4:3, 3:4 or 1:1
   - Zoom In: Zooms into the image
   - Zoom Out: Zooms out of the image
   - Move: Allows for the cropped area to be moved to desired areas of the image
   - Flip Horizontally: Flips the image on the horizontal aspect
   - Flip Vertically: Flips the image on the vertical aspect
   - Rotate Left: Rotates the image 45d to the left
   - Rotate Right: Rotates the image 45d to the right
   - Reset: Removes all updates that have not yet been Applied
   - Apply: Applies the edits made through the Crop options
   - Exit Crop: Exits the Crop options, regardless of applying updates


2. Once you have updated the Crop options to match your desired output make sure to press "Apply"
3. Once all edits have been applied and there's no further editing required click the "Save" button

To Re-size Images In Your Website:

1. Select the "Re-size" image option, this will bring up the re-size tools.
2. From here you can either manually input a desired Width and  Height or alternatively maneuver the display box by dragging the blue square on the bottom right of the image.
3. Once you have updated the Re-size options to match your desired output make sure to press "Apply".
4. Once all edits have been applied and there's no further editing required click the "Save" button.