Gutenberg: anchura bloques

Tras actualizar a WP 5.x y comenzar a probar el nuevo editor Gutenberg, me he encontrado con que el bloque central no ocupa todo el espacio disponible, tal y como podéis ver en la imagen:

Gutenberg anchura bloques

Para adecuar el ancho del bloque al espacio existente tenemos que hacer dos cosas:

1. Editamos nuestro plugin de funciones o el archivo functions.php de nuestro tema y añadimos lo siguiente:

//anchura bloque Gutenberg
add_theme_support('editor-styles'); // solo para el caso de que nuestro tema no lo soporte ya
add_editor_style( 'style-editor.css' ); // ruta relativa respecto al directorio del tema

2.- Creamos el archivo style-editor.css dentro de la carpeta del tema que estemos usando y añadimos las siguientes líneas:

/* Anchura bloque stylesheet */
/* Main column width */
.wp-block {
    max-width: 100% !important;
}

/* Width of "wide" blocks */
.wp-block[data-align="wide"] {
    max-width: 1080px;
}

/* Width of "full-wide" blocks */
.wp-block[data-align="full"] {
    max-width: none;
}

Modificar los valores a vuestro gusto.

Y os dejo un enlace que me ha facilitado Roberto Vázquez para que podáis ampliar más la información.

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *