Option to modify margins/paddings for template parts

[hanneslsm]

Description

I am facing an issue with the Site editor. I want my content to be followed directly by the footer, without any margin. However, this is not possible as the footer automatically gets the CSS class "wp-block-template-part", which has a margin. It is not possible to turn this off for this specific part (footer), and I do not want to globally change the block spacing as it would completely alter my theme.

It should be possible to adjust margins (and probably also paddings) for template parts individually.

Step-by-step reproduction instructions

1. Create a site with a footer template part
2. Try to have the content directly followed by the footer, without a margin
3. write this issue, because it's not possible.

Screenshots, screen recording, code snippet

Screen.Recording.2023-02-01.at.10.14.05.mp4

Environment info

• Gutenberg 15.0.1
• Brave v1.47.186
• Mac OS 13.1

Please confirm that you have searched existing issues in the repo.

Yes

Please confirm that you have tested with all plugins deactivated except Gutenberg.

Yes

[talldan]

However, this is not possible as the footer automatically gets the CSS class "wp-block-template-part", which has a margin

In the video, it looks like the style you turn off is wp-site-blocks > * + * and not wp-block-template-part. Is it definitely template part styles that cause the issue?

The problem might be caused by block spacing, if you try reducing block spacing in your global styles > layout settings, does it reduce the gap?

[talldan]

It could be related to the issue or one of the related issues - #43404.

[hanneslsm]

However, this is not possible as the footer automatically gets the CSS class "wp-block-template-part", which has a margin

In the video, it looks like the style you turn off is wp-site-blocks > * + * and not wp-block-template-part. Is it definitely template part styles that cause the issue?

Good point. Actually, the wp-block-template-part does not even has any attributes here. So, no, it's not coming from the template part styles but from wp-site-blocks > * + *

The problem might be caused by block spacing, if you try reducing block spacing in your global styles > layout settings, does it reduce the gap?

Yes.

Screen.Recording.2023-02-01.at.11.00.43.mp4

[github-actions]

Hi,
This issue has gone 180 days without any activity. This means it is time for a check-in to make sure it is still relevant. If you are still experiencing this issue with the latest versions, you can help the project by responding to confirm the problem and by providing any updated reproduction steps.
Thanks for helping out.

[richtabor]

As an alternative, you can wrap it in a group block and remove the margin there.

The tricky part about applying styles to the template part block is that the styles are not synced, only the bits within the template part.

[richtabor]

I think a better option would be to zero out template part margin, so it’s not affected by the block gap. But that introduces other minor issues like when you don’t want your content right up to your footer.

[WraithKenny]

So, you can sort of do what you need in theme.json, by adding a custom class to the template part using the Site Editor and then using custom css in the theme.json file:

{
	"styles": {
		"blocks": {
			"core/template-part": {
				"css": "&.site-footer { margin: 0; }"
			}
		}
	},
	"templateParts": [
		{
			"title": "Footer",
			"area": "footer",
			"name": "footer"
		}
	],
	"version": 2,
	"$schema": "https://schemas.wp.org/wp/6.4/theme.json"
}

But this feels less than satisfactory.

Better, would be if there was a way to use spacing settings on individual parts.

{
	"styles": {
		"blocks": {
			"template-part/footer": {
				"spacing": {
					"margin": {
						"top": "0"
					}
				}
			}
		}
	},
	"templateParts": [
		{
			"title": "Footer",
			"area": "footer",
			"name": "footer"
		}
	],
	"version": 2,
	"$schema": "https://schemas.wp.org/wp/6.4/theme.json"
}

Unfortunately, this doesn't seem to be a thing, or at least, I haven't found anything like it.

[genepine]

I also found this problem and solved it through a support topic.
https://wordpress.org/support/topic/get-rid-of-footer-block-start-margin/

footer.wp-block-template-part {
margin-block-start:0 !important;
}