To add an image onto a page:
- While editing an editable region, click the "Insert/Edit Image" icon ( or ) in the toolbar.
- In the "Source" field, click the "Browse" icon to search for an image. You can toggle between a list and a thumbnail view by clicking the icons to the right of the filter field. Use the breadcrumbs to move to a different folder, and filter by image name or tags if necessary. You can also choose an auxiliary site or other environment to look for files in with the dropdown in the top-right corner.
- If the image you want isn't available, you can upload it.
- Once you've chosen your image, click "Insert."
- Enter a value in the "Image Description" field. This is required for accessibility reasons.
- You can also enter a "Tooltip," which is the text that displays when someone hovers their cursor over the image.
- If you want, modify the dimensions of the image, and/or add a style from the "Class" dropdown. Use a percentage for responsive image sizing, or a pixel value.
- Click "Insert." Your image is now on the page!
Appearance TabLink to this section
The "Appearance" tab of the Insert/Edit Image box has some additional options for how your image looks.
- Alignment: Sets the alignment of the image against the text, e.g. left, right, center.
- Dimensions*: Sets the height and width of the image. If "Constrain Proportions" is checked, the image keeps its original height-to-width ratio.
- Vertical Space: Sets the amount of space between the top and bottom sides of the content area and the image.
- Horizontal Space: Sets the amount of space between the left and right sides of the content area and the image.
- Border: Sets the width of the image border. You can modify the color and style of the border in the "Style" field.
- Class*: Adds a style to the image.
- Style: Based on the appearance options you set, the styling code auto-completes in this field. You can also manually edit the styling here.
*In JustEdit, this field is in the "General" tab. In the Classic editor, this field is in the "Appearance" tab.