Aprende a desencolar la hoja de estilos de los bloques nativos de Gutenberg en WordPress y Génesis gracias a este tutorial usando un snippet de código.
La mayor novedad de WordPress 5.0 ha sido la incorporación del editor de bloques (Gutenberg). En Código Genesis puedes encontrar más de 20 tutoriales para sacarle todo el partido al nuevo editor de WordPress.
¿Has actualizado a WordPress 5.0 pero inhabilitando el nuevo editor?
Tengo noticias para ti: Gutenberg carga su hoja de estilos por defecto aunque no lo estés usando. Y lo mismo ocurre con los child themes de Genesis que están optimizados para el nuevo editor.
¿Quieres evitar que esto ocurra? Ningún problema, puedes quitar los estilos de Gutenberg con unas simples líneas de código así:
Instrucciones para desencolar las hojas de estilos de los bloques en WordPress y child themes de Genesis
Es imprescindible que realices el primer paso de este tutorial para evitar que se cargue la hoja de estilos para el nuevo editor WordPress con el primer apartado.
Aplica también el segundo solo en el caso de que tengas uno de los child themes de Genesis optimizados para Gutenberg.
1. Desconecta la hoja de estilos de los bloques del nuevo editor de WordPress
Agrega el siguiente fragmento en functions.php o en el plugin de funcionalidades:
Para ver este código y los otros 2055 snippets de esta web,
identifícate o suscríbete aquí.
Con esta línea de código te aseguras de que no se cargue la hoja de estilos de los bloques. Cuando estés preparado para usar el nuevo editor solo tendrás que borrar el snippet.
Además, funciona para cualquier child theme de Genesis o WordPress.
2. Elimina la hoja de estilos de los bloques en un child theme de Genesis
Algunos de los temas de Genesis ya se han optimizado para el nuevo editor y cargan hojas de estilo para adecuar el diseño al mismo.
Si quieres evitar esto, solo tienes que eliminar o comentar el snippet responsable de cargarlo.
En el caso de Genesis Sample en la línea 54:
Para ver este código y los otros 2055 snippets de esta web,
identifícate o suscríbete aquí.
Con esto evitas que carguen los archivos del child theme específicos para el nuevo editor de WordPress 5.0.
Para comprobar que ya no estás cargando las hojas de estilo puedes revisar la pestaña de recursos en el inspector de tu navegador web.
Podrás ver que en la carpeta «hojas de estilo» ya no se cargan los ficheros style.min.css (de WordPress) ni front-end.css (del child theme de Genesis).
Conclusiones
Si has actualizado a WordPress 5.0 pero todavía no estás utilizando el editor de bloques puedes mejorar la velocidad de tu página evitando la carga innecesaria de hojas de estilo.
En este tutorial has visto como hacerlo de forma sencilla, tanto para WordPress como para un child themes de Genesis.
¿Quieres hacerme alguna pregunta o darme una sugerencia para próximos snippets? Cuéntamela en los comentarios (exclusivo para suscriptores).
