Crop and Resize an Image for a Banner

Important Note

The banner images are pulled from a unique location (the Banner Images folder). Therefore, they are not located in the Public Assets (formerly Image Repository). You will need to upload banner images into the Banner Images folder.

Instructions

1. Navigate to the Homepage (we recommend using the Homepage button):
   
2. Ensure that the Live Edit state is toggled to ON:
   
3. In the Live Edit pane, click the Layout tab:
   
4. Click the Edit Banners for this Theme button, which will open a new window:
   
5. On the new window, click on the Banner image:
   
6. From the Banner Options pop-up window, click the Choose Image button:
   
7. Click the Actions button next to your desired banner image:
   
8. From the dropdown menu, select the Edit and Copy Image button:
   
9. Using the Image Cropping and Resizing tool, edit the image as necessary:
   
   
   • Image Edit Tools:
     
     
     • Move image or crop box: Move the image or the crop box around the space
     • Change crop box size: Manually change the size of the crop box using the click-and-drag function
     • Zoom In: Zoom into the image
     • Zoom Out: Zoom out from the image
     • Move the image to the left: Move the image to the left on the edit space
     • Move the image to the right: Moves the image to the right on the edit space
     • Move the image up: Move the image up on the edit space
     • Move the image down: Move the image down on the edit space
     • Rotate left: Rotates the image left
     • Rotate right: Rotates the image right
     • Flip Horizontal: Flips the image horizontally
     • Flip Vertical: Flips the image vertically
     • Reset: Removes and all edits and resets the image to the originally saved state
   • Aspect Ratio Options:
     
     • Free: Move the crop box around freely
     • 16:9: Automatically generates a 16:9 aspect ratio crop box
     • 4:3: Automatically generates a 4:3 aspect ratio crop box
     • 1:1: Automatically generates a 1:1 aspect ratio crop box
     • 2:3: Automatically generates a 2:3 aspect ratio crop box
   • Title Box: The title of the image in the Banner Images folder
     
   • Image Preview: Preview changes made to the image in real-time
   • Selection Box Info: The width and height of the crop box, measured in pixels
   • Resize: Enter a width and height to resize the image automatically
     • Lock/Unlock Ratio: Lock the ratio to maintain the aspect ratio; unlock the ratio to select width and height independent of one another
10. Click the Crop and Resize Selection button:
    
    Note: Clicking the "Overwrite if file exists?" checkbox will cause your updated image to overwrite the original image file. Please ensure that the original is still accessible before selecting this option.
11. Click the Save button:
    
12. Click the Insert button to insert the new image:
    
13. Click the Close/X button to close the Banner Options pop-up window:
    
14. Click the Save Theme button: