Block – Panel
The Panel block allows a full width background image with a text box floated over the top like this:
Add this block by adding the block called ‘panel’ shown in the design section, see below for adding blocks:
Adding New Blocks
Blocks are selected in WordPress by pressing the large, blue plus icon at the top left of the Block Editor or by typing a / at the start of a new paragraph, which will show the most commonly/recently added blocks by default. You can then enter the name of the block you are trying to add and it will update the list as you type.
The content for this type of block is added from the + icon within the block rather than in the right-hand column. This is because there is not a strict layout to what could appear within the content area over the image leaving it potentially flexible.
When this block is first added, it might be a little tricky to see the text as it can sometimes appear as white text, like so:
It is best to first select an image from the right hand ‘Add Image’ Block options to be able to see the content you are adding over the image. Other options are available when this panel is clicked and selected appear on the right hand side:
The ‘fixed‘ option allows the image to either Scroll with Page – or to be fixed to the background. The ‘position‘ option allows the content box to be aligned left or right, depending on the focal area of the image in question.
The ‘Padded Box’ option adds the white curved background behind the text. There may be instances where very light images don’t need the white box for adding contrast to the text over the image.
I am a panel box with text in it added by clicking on the panel.
In this example I have chosen the panel to be right aligned to not obscure the faces on the left.