Build Hero Image

There should be a Hero Image at the top of every program website's Overview page.

How to add a hero image to a page

Note: Prior to adding this content type, you should upload the image to the T4 Media Library. The hero image content type uses CDN PXL so you do not need to resize the image prior to uploading it to the T4 Media Library.

From the T4 Site Structure, navigate to the page you are updating. 

Add a new Hero Image content type

1. Open the Content tab of the page you are working on. 
2. Click Add content.
3. Click Hero Image/Video.
4. Add a name for the content type (typically "Hero"). 
5. To ensure the hero image is mobile responsive, you need to connect the image you uploaded to the T4 Media Library in all three places it says select image. You do not need to re-size or upload 3 different images to the media library. Start with the "Select image (Desktop)" field:
   • Click Select media.
   • Navigate to the program folder that is housing your photo in the T4 Media Library. 
   • Click on the photo you'd like to use for the hero. 
6. Repeat this process using the same photo for the "Select image (Tablet)" section and the "Select image (Mobile)" section. 
7. Once you've added the same image to all three places, click the Save Changes button to save the hero as a draft.
8. Ensure that the Hero is the top content type so that it appears at the very top of the page. 
9. Preview your updates and ensure the content displays appropriately. If everything displays correctly in the preview, approve the updates to be published.