Most elements can easily be resized directly from the authoring stage.
To resize an element on the stage:
- Select the element. You will see an outline and handle around the border of the element.
- To resize, simply grab a handle and drag to the desired size. If you want to maintain proportions, either hold Shift while dragging or select the checkbox between the Width and Height fields on the workspace toolbar.
Note: If no handles appear, the element may have been previously rotated. Rotated elements must be returned to their original position before being resized. If the Rotation symbol appears anywhere other than the top-center of the element, it has been rotated. Grab the Rotation symbol and drag the element back into position. When you release the rotation symbol should be at top-center and the handles will reappear. Follow the steps above to resize and return to rotated state as needed.
Tip: When inserting a large image, resize it following the steps above then optimize the image size using the Image Editor. This will improve load time for the image.
To optimize image size:
- Upload your image through the Media Browser or Media Library and insert it into your page.
- Hold the Shift key to constrain the proportions (so you’d don’t distort the image) as you drag the image’s corner handles to resize the image to the smaller display area you want.
- Once you’re happy with the size, click the image and open the Image Editor (Image Tools> Editor).
- A Save Changes dialog box appears asking, “Would you like to adjust this image to match the stage size?”. Click Yes to adjust the image to match the stage display size.
- In the Image Editor, click Save & Exit.
Note: Do not use this process to resize an image to make it larger. The image quality will degrade.
For more information, see Optimal Image Size.