WordPress y edición completa del sitio: cómo crear un tema secundario y un tema de bloque

¿Cuándo debería usar un tema hijo para WordPress? Es importante crear un tema infantil si planea realizar cambios personalizados en el código.

De esta manera, cuando se actualice el tema, no se sobrescribirán los cambios personalizados en el código.

Tradicionalmente, al trabajar con WordPress, esto requería hacer una copia de functions.php y style.css para crear el tema secundario y poner en cola el tema secundario con el tema principal.

Con la diferente estructura de archivos en Edición completa del sitiose necesitaron algunos ajustes para encontrar todos los archivos apropiados.

Afortunadamente, con la creación de la Crear complemento de tema de bloque por WordPress.org, crear no solo un tema secundario, sino también un tema completamente personalizado o una variación de estilo es más fácil que nunca.

Crear complemento de tema de bloqueCaptura de pantalla del repositorio de complementos de WordPress.org, diciembre de 2022

Configuración del complemento Create Block Theme en WordPress

Primero, querrá instalar y activar el tema de bloque de WordPress para el que desea crear su nuevo tema o tema secundario; en este caso, estoy usando Twenty Twenty-Two.

Veinte Veintidós temaCaptura de pantalla del panel de WordPress, diciembre de 2022

A continuación, siga los siguientes pasos:

Ir Complementos > Agregar nuevo.

En la ventana de búsqueda, busque «Crear tema de bloque».

Hacer clic Instalar y activar.

Página de complementosCaptura de pantalla del panel de WordPress, diciembre de 2022

Con el complemento instalado, tendrá algunas opciones nuevas en Apariencia, incluido Crear tema de bloque y Administrar las fuentes del tema.

Opciones de aparienciaCaptura de pantalla del panel de WordPress, diciembre de 2022

Crear un tema hijo de WordPress

El complemento Create Block Theme es una forma extremadamente simple de crear un tema secundario para un bloque, incluido un tema de edición de sitio completo. El complemento creará automáticamente la carpeta de partes, la carpeta de plantillas, theme.json y style.css.

Una vez que se instala el complemento, está listo para crear el tema secundario:

  • Por debajo AparienciaSeleccione Crear tema de bloque.
  • Siguiente seleccionar Crear hijo de Veinte Veintidós (si seleccionó un tema diferente, aparecerá una lista de ese tema).
  • A la derecha, complete Nombre del tema, Descripción del tema, URI del tema, Autor y URI del autor.
  • Haga clic en el azul Generar botón para crear el tema hijo.
información del tema hijoCaptura de pantalla del panel de WordPress, diciembre de 2022

Su tema hijo se exportará como un archivo zip.

archivo zip de tema infantilCaptura de pantalla del archivo de tema secundario generado, diciembre de 2022

Por debajo Apariencia > Temashaga clic Agregar tema y Subir tema, y seleccione el archivo zip que se generó.

Vaya a Temas y asegúrese de ver su nuevo tema secundario.

Creación de una imagen personalizada para un tema infantil de WordPress

Una deficiencia del complemento es que no le permite agregar un captura de pantalla.png para su tema hijoni utiliza el proporcionado con el tema principal.

Esto se puede solucionar fácilmente y proporciona un agradable toque personalizado para el tema de su hijo.

Usando su editor de imágenes favorito, cree una nueva imagen que tenga un tamaño de 1200 px por 900 px, y asígnele el nombre captura de pantalla.png.

Coloque la nueva captura de pantalla.png dentro de la carpeta del tema secundario que creó.

archivos en tema hijoCaptura de pantalla de los archivos de tema para el tema secundario de WordPress, diciembre de 2022

Vuelva a los temas y su nueva imagen debería aparecer con el tema de su hijo.

Imagen del tema infantil activoCaptura de pantalla del panel de WordPress, diciembre de 2022

Ahora que se ha establecido un tema secundario en su tema de bloque, se pueden realizar cambios en el tema.json y archivos de plantilla style.css sin anular los archivos de tema principal.

De esta manera, el tema principal se puede actualizar sin ningún problema.

También puede exportar el nuevo tema secundario con los cambios realizados, como la imagen, para usarlo como tema secundario para nuevas instalaciones del tema principal.

Crear un tema de bloque personalizado en WordPress

los Crear complemento de tema de bloque proporciona una serie de opciones para crear su propio tema. Puede clonar el tema actual y hacer sus propios cambios personalizados usándolo como plantilla.

Una vez que haya realizado los cambios y esté satisfecho con ellos, puede usar el complemento para exportar el tema con todos los cambios que realizó para usar su nuevo tema en otros sitios web.

Además, puede crear un nuevo tema completamente en blanco que utilice el tema actual como plantilla. Esta es una gran manera de hacer algo completamente personalizado.

Para crear un tema completamente nuevo, siga los siguientes pasos:

Por debajo Crear tema de bloqueelegir Crear tema en blanco.

Complete toda la información en el lado derecho, asígnele un nombre y agregue su nombre como creador, y presione Generar.

Crear tema en blancoCaptura de pantalla del panel de WordPress, diciembre de 2022

Su nuevo tema se descargará como un archivo zip.

Por debajo Apariencia > Temaspuedes cargar y activar tu nuevo tema.

Siga los mismos pasos que el tema secundario, si desea agregar una imagen personalizada para la captura de pantalla.png.

Active el nuevo tema y utilícelo como punto de partida para su nuevo tema.

nuevo tema en blancoCaptura de pantalla del panel de WordPress, diciembre de 2022

Use patrones, bloques, partes de plantillas y el editor de estilos para crear su nuevo tema con el aspecto deseado.

Una vez que haya terminado de trabajar en su nuevo tema, vuelva a Apariencia > Crear tema de bloque y exporte el nuevo tema, que contiene todos los cambios que le hizo.

Se exportará como un archivo zip y se puede cargar en cualquier nueva instalación de WordPress.

Administrar fuentes de temas de WordPress

Otra gran característica de la Crear complemento de tema de bloque es poder agregar y eliminar fácilmente fuentes para el tema.

Por lo general, para agregar nuevas fuentes a un tema, las fuentes deben descargarse, agregarse a la carpeta de fuentes y en cola en functions.php archivo, o un enlace de google habría que añadirlo al código.

Agregar varias fuentes puede complicar aún más el proceso.

Con el complemento, Fuentes de Google y fuentes locales desde su computadora se puede agregar o quitar fácilmente de su tema personalizado o de un tema que haya instalado y activado.

Para las fuentes de Google, haga clic en Agregar fuente de Google y la ventana desplegable le dará una lista de las fuentes de Google disponibles.

Seleccione la fuente, marque la casilla de verificación y haga clic en el botón para agregar Google Font a su tema.

Administrar las fuentes del temaCaptura de pantalla del panel de WordPress, diciembre de 2022
Agregar fuentes de GoogleCaptura de pantalla del panel de WordPress, diciembre de 2022

Agregar una fuente local que haya descargado es un proceso similar.

Haga clic para Agregar fuente localcargue el archivo de la fuente, complete el nombre de la fuente, el estilo y el peso, y presione el botón para cargar la fuente local en su tema.

Fuentes localesCaptura de pantalla del panel de WordPress, diciembre de 2022

Temas secundarios de WordPress simplificados

Con Edición completa del sitio y el Crear complemento de tema de bloquecrear su propio tema y variaciones de estilo es más fácil que nunca.

El uso del complemento en lugar de poner archivos en cola manualmente y cambiar el código hace que la creación de temas secundarios y la adición de nuevas fuentes sean un proceso simple.

Patrones, variaciones de estiloy bloques reutilizables cuando se usa con el complemento, son excelentes formas simples de crear su propio tema personalizado que puede exportar y usar nuevamente.

Todo sin necesidad de tocar ninguno de los códigos del tema.

Más recursos:

  • Cómo crear una página 404 personalizada en WordPress
  • Cómo elegir el mejor tema de WordPress para SEO
  • SEO técnico avanzado: una guía completa

Imagen destacada: Kaspars Grinvalds/Shutterstock

#WordPress #edición #completa #del #sitio #cómo #crear #tema #secundario #tema #bloque

Newsletter Updates

Introduce tu dirección de correo electrónico para suscribirte a nuestro boletín