How to customize Gutenberg editor margin for my GP theme?

Hi Avadhut,

Can you reshare the second screenshot?

https://imgur.com/NcvhnfK

I see. The Editor tries to replicate the actual Content space in the Frontend, set through the Customizer.

You can try altering the Padding and Container Width in Appearance > Customize > Layout > Container, and this should relatively reflect in the Editor.

Otherwise, if you want that spacing just for the editor, you'll need to enqueue your own Style in the Block editor while using the Child Theme.

For instance, in your Child Theme directory, you can create a new file called my-editor-style.css.

Then, add this PHP in functions.php:

add_action( 'enqueue_block_editor_assets', function() {
	wp_enqueue_style( 'my-block-editor-styles', get_stylesheet_directory_uri() . "/my-editor-style.css", false,'1.0', 'all' );
} );

Now, in your my-editor-style.css, you can add CSS for the Block Editor.

You can try adding this for instance:

.editor-styles-wrapper.block-editor-writing-flow {
    padding-left: 200px;
}