AAG Base Hero

AAG Base Hero - Without Image

Developer Notes

  • Component resides inside the EH Page Content tab in the Toolbox by the name EH Hero Banner under variant Default.
  • Applicable fields for this variant are: 
    • BackgroundImage: field to select the image of the hero banner.
    • Title: field to add title, displayed on the hero banner in H1 heading option.
  • There's an option to add a Background Color from the Paint Bucket Settings. The available background colors are listed in the Background color - AAG(local) section.
  • An example of a Default variant with no image is shown HERE
  • An example of a Default variant with an image is shown HERE
  • Background Color will not be applied if there's a background image selected.
  • This component needs to be added directly under the Section Container component, with the Extra Large option checked.

Content Author Notes

1. Open up Experience Editor (EE) 


2. Make sure you have "Editing View' enabled in "View" Tab. Click on the image placeholder and click the add image icon. 



3. Click the placeholder text to add title. 

4. Save and Publish changes. 


AAG Base Hero:

  • The Content Author should be able to edit the following:
    • Title (H1)
    • Background Image
  • The CA should be able to use the paint bucket option for:
    • Background color (AAG Brand Colors)
  • Styling should follow the live site
  • Background Color is optional in the event no image is selected.
  • The CA should be able to select between a light and dark font.
    • Light=White (Default)
    • Dark= Green #01506F
  • This component must follow accessibility standards for alt text, and keyboard navigation.


  • Content is stacked.