Styling blocks specific to the page content area

[johnhooks]

Is it possible to increase the gap between paragraph blocks in the only page content area?

I asked on WordPress Stack Exchange first, here is the best, and only, answer so far.

1. From the admin, go to Appearance > Editor.
2. At the very top of the editor you will see the current template being edited. Click the little dropdown arrow next to that and then "Browse all Templates".
3. From the list of templates, click on Single or Page.
4. Click on the "styles" icon in the top right (looks like a half moon).
5. In the right hand panel, click on Blocks > Paragraph > Layout.
6. Click on the paperclip/link icon next to "padding" to allow you to set just vertical spacing without affecting horizontal spacing.

This problem with this answer is it increases all the paragraphs on the whole page, some of which are in the header and footer.

[tomdevisser]

@johnhooks If you just want extra space in a specific place, the Spacer block might be sufficient

[johnhooks]

@johnhooks If you just want extra space in a specific place, the Spacer block might be sufficient

I appreciate the response, but I'm trying to style all pages and posts, increasing the gap between all top level blocks of the content. Dropping spacer blocks in while writing content isn't a solution for this problem.

[tomdevisser]

@johnhooks

This sounds like something that can be solved by adding just a single spacer in the template for the single. Another approach can be selecting the first block with the nth-child selector in CSS. For a more global approach on handling block spacing, check this blogpost by 10up.

Edit: one more additional method would be to add a custom class to every block you want to give additional spacing, and adding some custom global styles for that class.

[johnhooks]

This sounds like something that can be solved by adding just a single spacer in the template for the single.

@tomdevisser

I'll attempt this. If a spacer is put in the template's post content it will insert one between all the top level blocks?

Also, thanks for the link to the 10up best practices. It looks like a gold mine of good information.

[tomdevisser]

Ah no sorry, I confused top level blocks with the block on top of each page. The 10up article will help you with that!