Background to text in cover block
-
I am using the cover block with a H2 title over the top of a photo on all pages and posts. The heading is in white, so to make it stand out better against the photo, I have added a semi-opaque grey backgound behind it.
The Heading block extends almost full width, but the text often only extends part width. But the background also extends full width.
Is there any way to limit the background colour to just behind the text, rather than the full width of the block?
Thanks for any help.The blog I need help with is: (visible only to logged in users)
-
Another question if I may please.
I would also like to create a second page template for graphics that would better suit dark text rather than white text. The easiest way to do this would be to duplicate the existing template and just change a couple of colours.
Is there any way to duplicate a template? I can’t seem to find it.
Thanks again.
-
-
Hi there,
I am using the cover block with a H2 title over the top of a photo on all pages and posts. The heading is in white, so to make it stand out better against the photo, I have added a semi-opaque grey backgound behind it.
The Heading block extends almost full width, but the text often only extends part width. But the background also extends full width.
Is there any way to limit the background colour to just behind the text, rather than the full width of the block?
One trick you can try is to place your heading block inside of a Group Block.
The Group block brings together other blocks inside one container so that you can set a background color, adjust spacing, and organize different page sections. This guide will explain how to use the Group block on your site. Video Introduction Create a Group There are a few ways to group blocks together. You can choose to start with an empty Group block and add content to it, or yOne cool trick that the Group Block has is that you can set a background color just for that block. This will allow you to place a background color behind the text only (or any blocks that are contained within the Group Block) and allow you to remove the tint from your image.
Is there any way to duplicate a template? I can’t seem to find it.
There is not a specific function to create a copy of an existing template, but one trick you can use is to create a new (blank) template, then open the template you want to use as your starting point and copy all the blocks. You can paste them into the new template, same as how you would copy and paste text.
You can see how to copy all blocks from any existing template here: https://wordpress.com/support/site-editor/transfer-content-from-the-site-editor/#copy-all-content-from-the-template
Hope that helps. Please let us know if you have any more questions.
-
-
OK, I’ve tried this now. Duplicating the template was easy. I didn’t know about the “Copy all blocks” option which your reference gives. So that’s fine, thanks for that.
But the tinting behind the text hasn’t turned out exactly as I hoped. I had already removed the tinting from the cover picture and had it as background behind the text only. But that put the tinting in a strip right across the full width page, even when the text was short. So I added in a block as you suggested, and that reduced the width of the tinting (which was good) but if there was longer text, it reduced it as well so it went onto two lines. The outcome is probably better than before, but not exactly what I wanted. Any thoughts?
Thanks.
- The topic ‘Background to text in cover block’ is closed to new replies.
