• Saltar a la navegación principal
  • Saltar al contenido principal
Código Genesis

Código Genesis

Tutoriales de WordPress y Genesis Framework

  • Empieza aquí
  • Cuenta
    • Suscripción
    • Perfil
    • Actualizar tarjeta
    • Favoritos
    • Salir
  • Suscribirse
  • Acceder

Definir plantillas personalizadas de un tema de WordPress usando el theme.json

Descubre en este tutorial cómo definir las plantillas personalizadas en un tema de WordPress usando el fichero theme.json.

WordPress 5.8 introdujo el fichero theme.json que es una de las piezas clave sobre la que se fundamentan los temas de bloques o FSE (Full Site Editing).

Lo bueno es que el fichero theme.json se puede usar en temas clásicos así que es una buena idea que te familiarices con él.

Por eso, estoy publicando una serie de tutoriales centrados en que entiendas cómo funciona y sobre todo cómo puedes personalizarlo a tu gusto.

En este caso, vamos a ver cómo definir las plantillas personalizadas de un tema. 

Instrucciones para definir plantillas personalizadas en un tema de WordPress mediante el theme.json

1. Crear las plantillas personalizadas

Lo primero que tienes que hacer si quieres que se muestren las plantillas personalizadas en el editor, es crear las plantillas. Lógico ¿verdad?

Para este ejemplo vamos a usar una plantilla que esté en blanco (solo mostrará el contenido, sin cabecera, ni pie, ni barra lateral…) y otra sin título.

Para crearlas solo tienes que utilizar el editor de plantillas.

2A. Crear el fichero theme.json

En caso de que el tema no cuente con él, tienes que crear un fichero llamado theme.json y colocarlo en la raíz de tu tema.

Una vez lo hayas hecho, añade el siguiente código :

Para ver este código y los otros 1837 snippets de esta web,
identifícate o suscríbete aquí.

Con este código estarías añadiendo al editor las dos nuevas plantillas, una en blanco y otra sin título.

Estas son las propiedades que puedes modificar:

  • name: el nombre del fichero de la plantilla personalizada.
  • title: el título que se mostrará en el desplegable.
  • postTypes: el tipo de contenido que puede usar esa plantilla (page, post, course…).

2B. Modificar el fichero theme.json

En caso de que tu tema ya cuente con un fichero theme.json puedes añadir o eliminar plantillas personalizadas. Para ello busca la sección de "customTemplates" (si no existe créala al mismo nivel que "settings") y cambia el contenido entre corchetes ([ ]) teniendo en cuenta las propiedades que comentamos arriba.

3. Interfaz en el editor de bloques

Una vez que hayas añadido estas líneas, bien sea añadiendo un nuevo fichero theme.json o modificando uno existente, verás que aparece una nueva sección llamada «Plantilla» en el editor:

Selector de plantillas personalizadas

En la misma encontrarás un desplegable que mostrará las plantillas personalizadas que hayas definido en los pasos anteriores.

Conclusiones

Ahora ya sabes cómo definir las plantillas personalizadas en cualquier tema de WordPress usando el fichero theme.json.

Si tienes alguna duda sobre este tutorial, déjala en los comentarios.

¿Sugerencias para próximos snippets? Envíamelas con el formulario de contacto.

Todo ventajas de ser suscriptor.


FSE JSON theme.json WordPress

Nahuai Badiola

Desarrollador web especializado en WordPress y Genesis Framework. CEO de Código Genesis y cofundador de OsomPress (temas y plugins para WordPress).

Para dejar dudas o preguntas sobre este código, puedes identificarte o suscribirte.

  • Empieza aquí
  • Sobre Código Genesis
  • Preguntas frecuentes
  • Contacto

Aviso legal · Política de privacidad · Política de cookies · Condiciones de contratación
Copyright © 2023 · Código Genesis

¿Has olvidado tu contraseña?