In the modern theme, the project banner appears differently on the home page and on the project page, and this module allows you to adjust the block at the top of the page. You can also use it in other places on the page. You must first create your project (link to follow)
Click on "List of Projects"
Click on your project
Click on "MODULES"
Click on "Hero Banner" module
Adjust as needed: you can use the title and description entered when creating the project, or you can click the button to enter your own text.
Toggle off the "Use project banner image" button. Most project banners do not work on the Hero banner.
Click on "SAVE"
Click on the camera icone
Click on "Drag and drop or Click to choose a photo from the disk"
Reframe the picture
Click on "SAVE"
Click on "Backgroun color" to change the colour, which is black by default
Click on "Text color" to change the colour if necessary. Pay attention to the contrast to ensure good accessibility.
The backgroung opacity is not useful at this time, you can skip it.
Click on "Project"
Click on "PREVIEW"
Preview your banner
Click on "GENERAL INFORMATION"
Click on "Content" and add more text to fill the space if you wish.
Click on "SAVE"
Preview your banner with more text
Click on "MODULES"
Click on "Hero Banner"
Click on "Full screen image with overlay text"
Click on "SAVE"
Click on "Background opacity" to adjust.
Preview your banner in full-screen mode. Please bear accessibility in mind.
Click on "MODULES"
Click on "Hero Banner"
Click on "BUTTONS"
Click on "Primary"
Enter the call-to-action for the button
Enter the URL for the button
Click on "SAVE"
Preview your banner with a clickable button. Keep making changes until you have a banner that meets your needs.