Full width image component

Some photography just needs room to breathe. Use the full width image component when your image doesn't require text, links, cards or buttons within it.

The component also expands your sidebar options as well. It can be a container for any image asset including logos. Just remember, it will display below the main column content on mobile.

Things to bear in mind:

• The image depth adjusts to fit the image's proportions, so it can be used for tall image needs like maps

• On a two-thirds width page, embedding an image inside the rich text editor will achieve the same result as adding a full width image component below it

• Make sure your image is big enough (at least 1200px wide, ideally) and of good quality

To create the full width image component

1. Use Add entry and select Component – Full width image

2. Name – this is the system name seen in Contentful

3. Header – if you want to display a H2 above the image

4. Image – use Add existing media to find and add your image in the Media library. Or use Add new media to upload the image and give it a relevant title and description.

5. Remove margin bottom – select Yes if you want to remove the 40-pixel white padding below the image

6. Publish your component and it’s ready to to pages

Any questions? Email Lindsay Foley in the Central Digital team.