A Hero image is designed to be the first item on your page. They are typically used for homepage and landing page designs. To use a Hero image, make sure ‘No Sidebar’ is selected in the dropdown under ‘Sidebar’. Do not add content to the Body field.
Image
This is a title. It is required
To see more examples of the Hero image paragraph in action, visit the Hero image demo page.
In the Paragraph section, click "Add Paragraph" then select "Hero" from the Paragraphs menu.
Image
- Select an option from the ‘Theme’ dropdown. This will set the colors for your buttons and text.
- Select an option from the ‘Text and Button Alignment’ dropdown. This option will set the position of your title and button elements.
- Add a title.
- Upload an image. Images must be larger than 1152x768 pixels. Keep in mind that the Hero image will extend across the entire width of your browser screen. High resolution images can be found in the Illinois Image Database. You are required to add Alternative text to your image, this text should describe what the image is for screen readers. Next, you can adjust the position of the image crop or you can click on the image to keep the default settings.

- Buttons are optional and you can add up to three. Buttons require both a link and Link Text. You can link to an internal page by typing the title, then selecting it when the field autocompletes. To link to an external page, paste the entire URL into the URL field.
