Introducción al nuevo editor de plantillas de WordPress

Queda poco menos de un mes, el próximo 20 de Julio si va todo bien, para que el lanzamiento oficial de WordPress 5.8. Y como toda actualización mayor del CMS, viene con novedades interesantes. Y entre todas ellas, hoy nos queremos centrar en una que más nos llama la atención, y que es otro paso adelante del editor de bloques Gutenberg dentro de WordPress: el nuevo editor de plantillas.

Al igual que está pasando con los widgets, en la próxima versión de WordPress podremos crear plantillas para nuestras páginas y entradas directamente desde el editor de bloques, sin tener que escribir ni una línea de código y de forma sencilla. Esto va a permitir que tanto los desarrolladores de temas, como los usuarios finales que tengan ciertos conocimientos sobre el editor de bloques puedan construir plantillas. Eso si, y como suele pasar con Gutenberg, estaremos algo limitados en el momento de dar ciertos estilos, por lo que llegará un punto en el que, si queremos realizar una plantilla con un estilo muy específico, tengamos que usar algo de CSS.

En el artículo de hoy queremos mostraros como podemos activar el editor de plantillas desde hoy mismo para ver como funciona, y cuales son algunas de las diferencias que tiene con el editor de bloques que podemos encontrar al crear una entrada y/o página en WordPress.

Cómo activar el nuevo editor de plantillas

Hasta el lanzamiento oficial de WordPress 5.8, tenemos dos opciones para ir probando el nuevo editor de plantilla. La primera es instalar la beta de WordPress 5.8. En el momento de salir este artículo está disponible la beta 3. Como siempre, si vais a instalar la beta, os recomendamos hacerlo solo en entornos de prueba ya que, como su nombre indica, es una beta y no esta libre de contener errores aun por pulir

La otra opción es usar el plugin Gutenberg. Personalmente suelo instalar este plugin para ir probando las nuevas novedades que va a incorporar Gutenberg en el futuro, y así estar preparado para cuando esté de forma oficial en WordPress. Como siempre, os recomendamos que le echéis un vistazo a nuestro artículo sobre como instalar un plugin en WordPress, por si tenéis alguna duda sobre el proceso. En nuestro caso, vamos a ir viendo el nuevo editor de plantillas instalando el plugin Gutenberg.

Creando una nueva plantilla

Sea cual sea la opción que uséis, podéis entrar en el editor de plantillas de dos formas. La primera es directamente desde la pantalla de edición de entradas o páginas. Si os fijáis en el panel derecho del editor, bajo la pestaña Página, en el apartado Plantillas veremos el típico menú desplegable con las plantillas del tema que tengamos instalado. Pero si os observáis un poco más, justo debajo podemos hacer clic en Nuevo. Si pulsamos aquí, nos pedirá darle un nombre a la nueva plantilla, y al pulsar en Crear se nos abrirá el editor.

La otra opción para llegar hasta el editor de plantillas es desde el panel de administración de WordPress, si nos vamos a Apariencia > Plantillas. Aquí tendremos un listado de las plantillas que hemos idos creando, aunque si es la primera vez que entramos, aparecerá el listado vacío. Si pulsamos en el botón Añadir nueva de la parte superior, se nos abrirá el editor de plantillas.

listado de plantillas en el panel de administración de wordpress

Aunque el funcionamiento del editor de plantillas es el mismo entremos desde el editor de entradas/páginas, o desde Apariencia > Plantillas. Hay algunos detalles diferentes. Si lo hacemos desde el editor de entradas/páginas, veremos que nuestro editor de plantillas tiene un marco negro alrededor del viewport, y en la parte superior tendremos el nombre de la entrada/página desde donde hayamos entrado, además del nombre de la plantilla. El nombre lo podemos modificar si pulsamos sobre él, además de poder borrar directamente la plantilla. Si entramos desde Apariencia > Plantillas, el editor de plantillas si que tiene el mismo aspecto de Gutenberg que ya conocemos.

diferencias entre el editor de plantillas en apariencia, y el editor de plantilla desde entradas y páginas
Diferencias entre el editor de plantillas si entramos desde el editor de página/entrada (arriba izquierda), o si entramos desde Apariencia (abajo derecha)

Tanto si entráis desde un sitio u otro y exploráis un poco, seguro que os resulta todo tremendamente familiar. Y es que el funcionamiento de este editor es el mismo que si estuviésemos creando una página o entrada con Gutenberg. Tenemos nuestro panel derecho de Ajustes, el panel izquierdo para ver los bloques usados en formato lista, y el listado de bloques que podemos usar. Hablando del listado de bloques, esta actualización también nos trae nuevos bloques, especialmente útiles para crear plantillas.

Nuevos bloques para el editor de plantillas

Si nos paramos a mirar el listado de bloques del editor de plantillas, y bajamos hasta la sección de diseño, veremos unos nuevos bloques que no están en la versión actual de WordPress. Esto son algunos de ellos:

  • Site Logo
  • Site Tagline
  • Site Title
  • Query Loop
  • Post Title
  • Post Content
  • Post Date
  • Post Excerpt
  • Post Featured Image
  • Post Author
  • Post Categories
  • Post Tags
  • Login/out
  • Page List
listado de nuevos bloques para crear plantillas en wordpress
Listado con los nuevos bloques del editor

Estos bloques nos van a resultar de mucha utilidad cuando empecemos a construir nuestras propias plantillas. Por ejemplo, si quiero hacer una plantilla para mis entradas en el blog, puedo crear un diseño donde aparezca la imagen destacada, el autor de la entrada, la fecha de creación, sus categorías y etiquetas. Y al meter todo este contenido en cada entrada, automáticamente aparecerá sin tener que modificar la plantilla original. Todo esto desde el propio editor y sin tener que escribir una sola línea de código.

Eso sí, es muy importante siempre el incluir el bloque Post Content. Este bloque va a albergar el contenido que añadamos desde el editor de entradas/páginas. Si no añadimos este bloque, y usamos esta plantilla, el contenido de la entrada o página no se verá en el resultado final, solo lo que hayamos creado como plantilla.

ejemplo de plantilla creada mediante bloques
Ejemplo de plantilla creada desde el nuevo editor

Una vez hayamos creado nuestro propio diseño de plantilla desde el editor, solo nos queda guardarlo y ya podremos usarlo en cualquier entrada o página. Y por supuesto, podemos editarlo en el futuro para hacer cualquier tipo cambio.

¿Qué supone para WordPress este nuevo editor de plantillas?

Como hemos podido ver, para los que estén habituados a trabajar con el editor de bloques de WordPress, se sentirán como en casa con el nuevo editor de plantillas. Y los nuevos bloques creados especialmente para las plantillas son un paso más allá para que no tengamos que volver a crear una plantilla usando código.

Eso sí, no todo son buenas noticias. Como todos sabemos, el editor de bloques de Gutenberg tiene limitaciones, que también están presentes en el editor de plantillas. Para mi, una de las más importantes es el no poder controlar los margins y paddings de los bloques. Por lo que, si queremos crear plantillas con diseños muy definidos, siempre vamos a tener que acabar recurriendo a dar estilos mediante CSS.

La conclusión que podemos sacar de todo es que el potencial del editor de plantillas va de la mano del editor de bloques. Y que cuanto mejor sea este último, mejor será el primero. Por lo que los diseñadores y desarrolladores que trabajen con normalidad en WordPress tendrán ahora en sus manos una nueva opción para crear plantillas. Mientras que los que prefieren mantenerse alejados de Gutenberg, siempre podrán seguir usando los recursos de siempre.

Con esto terminamos por hoy. Esperamos os haya gustado esta pequeña introducción al funcionamiento del nuevo editor de plantillas de WordPress y, como siempre, esperamos vuestras impresiones en los comentarios de todos aquellos que hayáis tenido ocasión de probarlo.

Deja una respuesta

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