managed wordpress hosting

How to Widen Gutenberg Editor


On 12-14-2018 wordpress

The default width of Gutenberg is quite narrow. Not sure the logic behind this.

Here is a quick way to make it a standard monitor width.

In your function.php drop this code:

//Gutenberg
add_theme_support('editor-styles');
function custom_gutenberg_styles() {
wp_enqueue_style('custom-gutenberg', get_theme_file_uri( '/css/gutenberg.css' ), false, '1.0', 'all');
}
add_action('enqueue_block_editor_assets', 'custom_gutenberg_styles');

Then create a folder called css in your theme directory then create gutenberg.css

.wp-block{
max-width:1377px !important;
}

That’s it now a width that isn’t so small!

And doing it this way you will be able to apply any custom css styles to it moving forward, just edit gutenberg.css file you created.

Speak your mind

*