Hero Banner
Table of Content Draft Space
How to Edit an Existing Hero Banner Component
- Hover over the body of the component. (see image below)
2. Select the pencil icon. (see image above)
Is the editor taking a while to open? Try double-clicking the pencil icon.
3. Select Browse. (see image below)
4. Navigate to the image. (see image below)
Best Practices
- Avoid images that have text or writing on them.
- Find images that are appropriate for the section and page.
- Avoid images that are "too casual, informal, or suggestive in nature.
- Also there should not be any images that depict third party logos except for NIH, CDC -USF affiliates - with approval from your department and the organization.
- Images should be in one of the following formats:
PNG
JPEG
GIF
*TIFF and EPS images are often too large for web use.
5. Select the image. (see image above)
6. Select Select.
7. Fill in the following fields:
a. Title: This will be the title that displays with the image.
b. Description: This will be the text that displays with the image.
c. Link URL: This is where you insert the URL for the Call to Action button.
d. Link Text: This will be the text that will display on the Call to Action button.
e. Open in New Tab: Make sure Open in New Tab is selected.
Don't want a Title, Description, or Call to Action button?
To remove a Title, Description, Link URL, or Link Text included in the Hero Banner, leave the appropriate field(s) blank.
8. Select OK.
9. Select the gear icon to customize the Hero Banner. (see image below)
a. Theme: This will give you options to change the look and feel of the slide show.
b. Opacity: Move the slider to make the overlay darker or lighter.
c. Text Position: This setting will change the position of the text.
d. Save: Select Save if you have made any changes.