Content block as per demo

Just figured this out myself. ??

To do this, start with a Cover block and add an image to it. Hover over the block to make the toolbar appear, and click the “Full Width” alignment: https://cld.wthms.co/cTg8ai

Hi James,

Got this far, you can then alter the opacity of the cover image overlay to give a solid colour background, however, once you add the title text you dont seem to be able to nest a button underneath it like in the demo?

cheers,

Neil

Are you referring to https://2019.wordpress.net/ ?

Even though the image is full width, the text is still more left-aligned. Other images though can similarly be aligned full width.

I am referring to the ‘view case study’ buttons – they seem nested in the header.

THanks.

I finally found it thanks to https://wordpress.com/theme/twentynineteen which has a screenshot with the blocks labeled, after hunting myself forever. … so many blocks ??

It’s a pullquote block!

With that said though, I haven’t found a screenshot or a demo with the buttons in your screenshot. Where did you find that?

Swinging back to confirm, you can add a button block below or above it, but not on it.

I think your screenshot may be from a pre-release demo. I can’t find any currently online demos or screenshots like the one you shared.

I was able to make a pull quote block look like that, but I had to resort to cheating a bit. I made the pullquote block, filled in the header and text, made it full, formatted the text the way I wanted it… Then I switched to Edit as HTML and put this in the text directly:

<div class="wp-block-button is-style-outline"><a class="wp-block-button__link has-text-color has-white-color has-white-background-color" href="https://example.com>Test Button</a></div>

It works, and even will show it properly if you switch the block back to Edit Visually, but the editor doesn’t really understand it.

I think to do this properly, the pullquote block, along with others, will need to understand and have nested blocks for it to work. That’s a future enhancement to a number of these blocks, I believe.

Just to close the loop here, I heard back from the Twenty Nineteen designer, and that is the design for the Call to Action block.

This block was pulled from WordPress 5.0 and pushed back to maybe 5.1, which is why it’s only visible in an older screenshot.