Blog sobre desarrollo WordPress en Español Desarrollo WordPress en Español
gutenberg

Cambiar el ancho del editor Gutenberg

Pues me llegó el momento. Tras darle un tiempo, por fin me he decidido a probar Gutenberg. Lo probé en Septiembre de 2017 para una meetup en WordPress Madrid cuando aún andaba por la versión 0.6 creo recordar, y no volví a probarlo.

Por aquel entonces, y así lo dije en la meetup, lo veía como el futuro de los page builders, más que nada porque sería el nativo de WordPress, aquel que traería el equilibrio a la fuerza.

En la WordCamp Zaragoza 2018, varias personas tuvimos el placer de conversar con Matías Ventura, que nos enseñó in situ el potencial de Gutenberg y la idea que tenían para el futuro.

Como digo, no volví a probarlo, hasta ahora. En líneas generales me gusta, la verdad, aunque lo veo algo verde, y el mero hecho de escribir es más tedioso que antes… pero es simplemente una percepción inicial. Y también hay cosas que (personalmente) no me gustan, como lo primero que me he encontrado: el ancho del editor Gutenberg no ocupa todo el espacio disponible en la pantalla.

En mi caso, con una pantalla FullHD, ocupa el 50% aprox, queda mucho aire. Si queréis que ocupe el ancho disponible, sólo tenéis que seguir estos pasos:

Lo primero, si tu tema no es compatible con Gutenberg, añade estas líneas en tu functions.php:

//Theme setup function my_theme_setup() { add_theme_support('editor-styles'); // Relative path from theme directory add_editor_style('css/style-editor.css'); } add_action( 'after_setup_theme', 'my_theme_setup' );

Con esto simplemente estamos diciendo que nuestro tema soporta una hoja de estilos para el editor. Y encolamos un CSS que se cargará en nuestro panel de administración de WordPress cuando estemos editando con Gutenberg.

En esta hoja de estilo simplemente añadiremos esta regla:

/* Main column width */ .wp-block { max-width: 100%; }

De este modo, el editor ocupará el 100% del espacio disponible.

Puede que también te interese

Autocomplete Off en el formulario de login al backend de WordPress
Autocomplete Off en el formulario de login al backend de WordPress
En ésta entrada vamos a ver cómo agregar la funcionalidad autocomplete=”off” para los campos de usuario y clave en el formulario de login al backend…
Cómo definir una plantilla diferente por categoría para el detalle de los posts
Cómo definir una plantilla diferente por categoría para el detalle de los posts
En WordPress se usa la plantilla single.php para el detalle de los posts. Podemos crear plantillas para los posts de un custom post type concreto…
Reemplazar palabras por enlaces en nuestras entradas
Reemplazar palabras por enlaces en nuestras entradas
En algunas ocasiones puede ser de utilidad crear una función para automatizar un proceso como por ejemplo sustituir palabras por enlaces dentro del contenido de…
Cómo añadir campos personalizados o custom fields al back-end de WordPress de forma elegante
Cómo añadir campos personalizados o custom fields al back-end de WordPress de forma elegante
En esta entrada vamos a ver como añadir campos personalizados o custom fields al back-end de WordPress de manera elegante, es decir, utilizando meta_boxes. Actualmente…