[Resolved] Changing Block Editor full-width (no padding) to default

[Alec]

Hello,

I have created a custom Blog Post Template block element with dynamic data and made a GP Full-Width layout to replace the old-way header element+layout element. The header in a block element is set to full width and the content area to 800 px.

I’ve noticed that when I edit posts it displays full width with no padding i.e. the backend (editor) and frontend (actual post display) are different.

I use the GP full-width layout for pages too but they look OK on the backend.

I suppose I did not make the right settings in the Blog Post Template Block Element. But could not figure them out.

Once I saw there is a workaround to fix the width of the editor by adding some lines of code.

Can you help me to resolve this?

Here is the sample post: https://aleckatzmusic.com/sullivan-fortner-live-from-ny/

Screenshots of the elements:
https://app.screencast.com/u6pAlv3XwtOM5
https://app.screencast.com/sFzfpzlvvQc99
https://app.screencast.com/to5k7P3raBT9U

Thanks!

Alec

[Ying]

Hi Alec,

Not sure I understand your question very well, do you want to add some paddings only for the post/page editor?

May I ask why?

[Alec]

Hi,

thanks for the reply,

in the Blog Post Template block element, the container with the dynamic content of the post is set to 800, but it does not reflect in the editor showing full-width content with no padding.
So, as you can see all the content goes full-width in the editor even though i set it in the element to 800:
https://app.screencast.com/3tYmpaR1yeaks

Before that, when I used a layout element for posts with the content area set to default container width (1200) and content width to 800. So when I create/ edit posts I see the content the way it looks on the front end.

[Ying]

I see, can you try this PHP snippet?

wp_add_inline_style( 'wp-block-library', 
'.post-type-post .editor-styles-wrapper {
    max-width: 800px !important;
    margin-left: auto;
    margin-right: auto;
}' 
);

Adding PHP: https://docs.generatepress.com/article/adding-php/

[Alec]

This works perfectly,

thank you!

[Ying]

No Problem, glad to help 🙂

[Author]

Posts