Image

The image component can be inserted into many components including Hero, Text With Media, and others. It can also be added as a standalone component directly on the page.

Image: You need to upload the image in Cloudinary. Click the Cloudinary button and then either select and existing photo and click Insert, or upload a new photo and click Insert. If you then do this a second time, the second image will be used for mobile devices.

Title: This is used for SEO purposes. Add text that describes the image.

ALT Text: People with vision difficulties will have this text read to them by their screen reading device to describe the image.

Credit: If this image requires a citation, list the source here.

Background Color: If you do not choose full width as the position, it will appear in a section with this background color.

Position: Full Width will stretch to the edges of the screen.

Size: If you chose Centered under Position, select the size that the image should appear.

Hide On Mobile: Will hide the image on mobile devices.

Use Original Aspect Ratio: If the image is for decoration, select no and it will be cropped responsively. If the image conveys information/content select yes and the whole image will always display.

Navigation Anchor: Adding a navigation anchor allows users to scroll to this section via links in a navigation bar.

Click Through URL: If an image is used as a body component and is not used in another component (like in a Text With Media or Carousel), then the Click Through URL can be used the link the image somewhere. Be sure to add appropriate ALT Text and Title for accessibility purposes so that screen readers can read any text on the image.