Before you can add an image to a Windows component, you need to upload the image to the 'Media' area in the Govstack back office.
To add an image window, select 'Image' from the slide-out panel. Then, in the 'Content' tab:
- Upload an image from your Media library by selecting the "+" icon next to the 'Image' field. From here, choose the folder that contains the image you'd like to add and select the image
- If you would like to have text overlay the image, add any combination of a heading, subheading and text in each applicable field. Choose the heading level or font size for the text
- If you would like the image to link somewhere, add a button in the 'Button' field. This will overlay a button on the image. If you want to hide the button, so that users can just click on the image itself rather than an overlaid button, turn on the 'Hide button' toggle
Once you have created your image window in the 'Content' tab, move to the 'Settings' tab to adjust the image window settings.
In the 'Background Colour' setting, you can choose a colour to overlay over your image. Turn on the 'Add colour overlay' toggle below if you would like to use this setting. Any text you added to the window will be placed over top the colour overlay. This can help improve the colour contrast of text over your image and can be potentially more accessible for users with colourblindness or low vision.
Text alignment and position
In the 'Text alignment' setting, select whether you want any overlaid text to be left aligned, centred or right aligned. In the 'Text position' setting, select where on the image you want the text to appear.