We have a few options on how to create this ‘padded block with background image’ using WP’s Cover Block. See below for variants and use this guide as a reference on options.
- The background image should be 1440px wide at a minimum.
- Using the editor options you can choose:
- Screened overlay or none/dark or light text
- Background position of the image
- Normal (wide) or full width (for wide template pages, will go to edge of viewport)
- left, center, or right aligned text
This first example has the default settings in place.
Default Centered Headline should be h2
Subhead should be h3
To adjust alignment or color of text, you’ll need to add certain classes to
Additional CSS Class in the block settings. Options:
text-right– does what you think 😉
text-dark– changes text to dark (good for light images without screened background)
Dark Text, removed the screened bg
alignfull can’t go edge to edge unless you use the wide template. Note we are using WP’s sizing functionality here.
alignwideis not currently in use
Will have different effects on normal vs wide template
Home page has a special version ‘with-related-posts’. Currently that second block is hardcoded HTML. The parent cover block must include the