Cómo crear un tema hijo en WordPress [Plugins y código]
Crear un tema hijo en WordPress nos permite modificar una plantilla sin perder los cambios cuando se actualiza el tema principal. Podemos utilizarlo para añadir CSS personalizado, modificar archivos de WooCommerce, crear nuevas plantillas o incorporar funciones relacionadas directamente con el diseño y el funcionamiento del tema.
Cómo fue crear un tema hijo en WordPress: Guía completa paso a paso
Qué es un tema hijo en WordPress
Un tema hijo de WordPress es una plantilla que hereda el diseño, los estilos y las funciones de otro tema, conocido como tema padre. En lugar de modificar directamente los archivos originales, creamos un espacio independiente donde podemos añadir nuestras propias personalizaciones.
Esto permite que el tema principal siga recibiendo actualizaciones sin sobrescribir los cambios que hayamos realizado. WordPress cargará primero el tema padre y después aplicará los archivos, estilos o funciones que hayamos añadido en el tema hijo.
Un tema hijo no es una copia completa de la plantilla. Normalmente comienza con muy pocos archivos y solo vamos incorporando aquellos que necesitamos modificar. De esta forma, evitamos duplicar toda la estructura del tema y mantenemos las personalizaciones mucho más organizadas.
Por qué es recomendable utilizar un tema hijo
Para crear un tema hijo en WordPress necesitamos generar una nueva carpeta dentro del directorio de temas y añadir, como mínimo, un archivo style.css con la información de la plantilla padre. También podemos crear un archivo functions.php para cargar estilos y añadir funciones personalizadas.
Modificar directamente un tema principal puede parecer una solución rápida, especialmente cuando solo queremos añadir unas líneas de CSS o un pequeño fragmento de PHP. El problema aparece cuando llega una actualización y sustituye los archivos que habíamos editado.
En ese momento podemos perder todos los cambios sin darnos cuenta. En algunos casos se trata simplemente de un detalle visual, pero también podemos borrar funciones importantes, modificaciones de WooCommerce o plantillas personalizadas que afectan al funcionamiento de la web.
Utilizar un tema hijo nos permite actualizar la plantilla con mucha más tranquilidad. Las modificaciones permanecen separadas y podemos identificar con mayor facilidad qué cambios hemos realizado nosotros y cuáles pertenecen al desarrollador del tema.
Además, mantener el código ordenado facilita mucho el trabajo cuando volvemos a tocar una página después de varios meses o incluso años.
Las páginas web pueden durar muchos años
Cuando creamos una página web es fácil pensar únicamente en las necesidades actuales del proyecto. Sin embargo, muchas webs continúan funcionando durante bastante tiempo y van evolucionando poco a poco.
En nuestro caso trabajamos con proyectos que pueden tener diez años o más. Algunas páginas han cambiado de alojamiento, han incorporado WooCommerce, han añadido nuevos tipos de contenido y han pasado por distintas fases de diseño sin necesidad de empezar desde cero.
También hay tiendas online creadas en 2020 que siguen funcionando correctamente, pero que ahora necesitan nuevas modificaciones. En seis años han cambiado WordPress, WooCommerce, las plantillas, los editores visuales, los sistemas de caché y prácticamente todas las herramientas que utilizamos para desarrollar una web.
Por eso, cuando volvemos a trabajar sobre un proyecto antiguo, puede ser recomendable mantener el contenido y la estructura, pero sustituir la plantilla por otra más moderna, rápida y compatible con las tecnologías actuales.
Si todas las funciones personalizadas están mezcladas dentro del tema anterior, cambiar la plantilla puede convertirse en un problema. En cambio, si hemos organizado correctamente las modificaciones, podemos decidir fácilmente cuáles deben acompañar al diseño y cuáles deben mantenerse independientemente del tema utilizado.
En este vídeo de nuestro canal de YouTube explicamos cómo crear un tema hijo además de cómo poner el precio de las variaciones en la parte superior del producto WooCommerce, por lo que podéis ver cómo se hace de forma visual.
Diferencias entre un tema hijo y Code Snippets
Tanto un tema hijo como Code Snippets nos permiten añadir funciones personalizadas en WordPress, pero no sirven exactamente para lo mismo.
El tema hijo está relacionado directamente con la plantilla. Es el lugar adecuado para guardar estilos propios, modificar archivos del tema, crear plantillas específicas o personalizar la presentación de WooCommerce.
Code Snippets permite añadir fragmentos PHP sin editar directamente el archivo functions.php. Las funciones se guardan en la base de datos y normalmente continúan activas aunque cambiemos de tema.
Esta diferencia es importante cuando pensamos en el futuro de la web.
Por ejemplo, una función que modifica el comportamiento general de WordPress o WooCommerce puede seguir siendo necesaria aunque cambiemos completamente la plantilla. En ese caso, Code Snippets puede ser una opción más cómoda porque el código no depende del tema hijo.
En cambio, una función creada únicamente para modificar un elemento concreto de la plantilla puede dejar de tener sentido al cambiar el diseño. Guardarla en el tema hijo permite que desaparezca automáticamente cuando activamos otro tema.
Qué código debemos guardar en el tema hijo
El tema hijo es recomendable para las modificaciones vinculadas con el diseño o con la estructura de la plantilla.
Podemos utilizarlo para añadir estilos CSS personalizados, modificar la forma en la que se muestran las entradas, crear una plantilla especial para determinadas páginas o adaptar archivos de WooCommerce.
También es habitual utilizar su archivo functions.php para cargar hojas de estilo, registrar nuevas zonas de widgets, modificar menús o añadir funciones que dependen directamente del tema utilizado.
Por ejemplo, si añadimos un fragmento para cambiar la posición de un elemento dentro de la ficha de producto y esa posición depende de la estructura HTML de la plantilla, tiene sentido mantenerlo dentro del tema hijo.
De esta forma, cuando cambiemos de tema podremos revisar si esa función sigue siendo necesaria o si debe adaptarse a la nueva estructura.
Qué funciones podemos guardar en Code Snippets
Code Snippets puede resultar más adecuado para funciones generales que queremos conservar aunque cambiemos de plantilla.
Podemos utilizarlo para añadir tipos de archivos permitidos, modificar el comportamiento del administrador, personalizar ciertos procesos de WooCommerce, crear shortcodes o incorporar pequeñas funciones que no dependen del diseño.
También facilita mucho la gestión del código. Podemos asignar un nombre y una descripción a cada fragmento, activarlo o desactivarlo con un clic y localizar rápidamente una función concreta sin tener que revisar un archivo functions.php con cientos de líneas.
En nuestro post sobre cómo añadir código PHP en WordPress con Code Snippets explicamos su funcionamiento y cómo utilizarlo de forma segura.
Aunque siempre recomendamos disponer de un tema hijo, combinarlo con Code Snippets puede ser una de las mejores formas de mantener una web organizada a largo plazo. El tema hijo se encarga de las modificaciones de la plantilla y Code Snippets conserva las funciones generales del proyecto.
Cómo crear un tema hijo en WordPress manualmente
Para crear un tema hijo manualmente necesitamos acceder a los archivos de WordPress mediante FTP o desde el administrador de archivos del alojamiento.
Dentro de la instalación debemos entrar en la siguiente ruta:
wp-content/themes/
En esta carpeta encontraremos todos los temas instalados en WordPress. Debemos crear una nueva carpeta para el tema hijo.
Por ejemplo, si estamos utilizando el tema Kadence, podríamos llamar a la carpeta:
kadence-child
Es recomendable utilizar minúsculas, evitar espacios y añadir la palabra child para identificarla fácilmente.
Dentro de esta carpeta tendremos que crear al menos el archivo style.css.
Crear el archivo style.css del tema hijo
El archivo style.css permite que WordPress reconozca el tema hijo y sepa cuál es su plantilla principal.
Dentro de la carpeta que acabamos de crear añadimos un nuevo archivo llamado:
style.css
En su interior podemos pegar el siguiente código:
/*
Theme Name: Kadence Child
Description: Tema hijo personalizado
Author: Javier Callejo
Template: kadence
Version: 1.0
*/
Debemos prestar especial atención al campo Template.
Este valor tiene que coincidir exactamente con el nombre de la carpeta del tema padre. No debemos escribir el nombre comercial de la plantilla, sino el nombre real de su directorio dentro de wp-content/themes.
Por ejemplo, si la carpeta del tema principal se llama kadence, debemos escribir:
Template: kadence
Si utilizamos Astra, GeneratePress u otra plantilla, tendremos que sustituir ese valor por el nombre correspondiente.
El resto de los campos pueden personalizarse libremente. Podemos cambiar el nombre del tema hijo, añadir una descripción o indicar el nombre de la persona o empresa que lo ha creado.
Crear el archivo functions.php
Aunque no es obligatorio para que WordPress reconozca el tema hijo, normalmente también crearemos un archivo llamado:
functions.php
Dentro podemos añadir la carga de la hoja de estilos del tema padre y todas las funciones relacionadas con la plantilla.
Un ejemplo básico sería el siguiente:
<?php
/**
* Carga los estilos del tema padre.
*/
add_action( 'wp_enqueue_scripts', function () {
wp_enqueue_style(
'parent-style',
get_template_directory_uri() . '/style.css'
);
} );
Dependiendo del tema utilizado, puede que la plantilla ya cargue automáticamente los estilos y no sea necesario añadir este código. Sin embargo, continúa siendo una estructura habitual en muchos temas hijo.
A partir de este momento podemos añadir nuevas funciones dentro del archivo, siempre debajo del código existente y sin volver a escribir la etiqueta <?php.
Debemos tener cuidado al editar functions.php, ya que un error de sintaxis puede provocar un fallo crítico en WordPress. Por eso recomendamos realizar una copia de seguridad y evitar modificar una web activa sin tener acceso al alojamiento o al FTP.
Activar el tema hijo desde WordPress
Una vez creados los archivos, podemos entrar en el escritorio de WordPress y acceder a:
Apariencia > Temas
El nuevo tema hijo debería aparecer junto al resto de las plantillas instaladas.
Antes de activarlo conviene realizar una copia de seguridad de la web. Después podemos pulsar en Activar y comprobar que el diseño continúa mostrándose correctamente.
Al activar el tema hijo, WordPress seguirá utilizando el tema padre para cargar la mayoría de los archivos. La diferencia es que ahora podremos añadir nuestras modificaciones dentro de la nueva carpeta.
En algunos casos puede ser necesario volver a seleccionar la posición de los menús, revisar los widgets o comprobar la configuración del personalizador. Esto depende del tema y de cómo se hayan guardado sus opciones.
Crear un tema hijo con un plugin
También podemos crear un tema hijo utilizando un plugin como Child Theme Configurator. Esta opción puede resultar más sencilla si no queremos acceder manualmente a los archivos de WordPress.
Después de instalar y activar el plugin, encontraremos una nueva opción dentro del menú Herramientas. Desde allí podemos seleccionar el tema padre, analizar su configuración y generar automáticamente el tema hijo.
El plugin también permite copiar algunos ajustes del tema principal para evitar que cambien los menús, widgets o configuraciones al activar la nueva plantilla.
Una vez creado el tema hijo, podemos desactivar y eliminar el plugin si ya no vamos a utilizarlo. El tema seguirá funcionando porque los archivos se habrán creado dentro de la carpeta correspondiente de WordPress.
Aunque el proceso mediante plugin es más cómodo, recomendamos conocer al menos la estructura básica de un tema hijo. Esto nos ayudará a identificar sus archivos y realizar futuras modificaciones con mayor seguridad.
Mejores plugins para crear un tema hijo en WordPress
Aunque podemos crear un tema hijo manualmente, utilizar un plugin suele ser la opción más rápida cuando no queremos acceder por FTP o crear los archivos uno por uno. Estas herramientas generan automáticamente la carpeta del tema hijo, el archivo style.css y, normalmente, también el functions.php.
Antes de instalar cualquiera de ellos recomendamos realizar una copia de seguridad. El proceso es sencillo, pero algunos plugins también permiten copiar configuraciones, archivos o estilos del tema principal, por lo que conviene revisar bien las opciones antes de activar el nuevo tema.
Child Theme Configurator
Child Theme Configurator es probablemente el plugin más completo y conocido para crear temas hijo en WordPress. Además de generar los archivos necesarios, analiza la plantilla principal para detectar cómo carga sus estilos y configurar correctamente el nuevo tema.
Podemos seleccionar el tema padre, crear un nuevo tema hijo y copiar las opciones del personalizador, los menús y los widgets. Esto resulta especialmente útil cuando la página ya está avanzada y queremos evitar que algunas configuraciones cambien al activar el tema hijo.
También incluye herramientas para localizar y modificar estilos CSS, aunque para crear un tema hijo básico no necesitamos utilizar todas sus funciones. Una vez terminado el proceso y comprobado que todo funciona correctamente, podemos desactivar y eliminar el plugin sin que el tema hijo deje de funcionar.
WP Child Theme Generator
WP Child Theme Generator es una alternativa más sencilla para crear un tema hijo a partir de cualquiera de las plantillas instaladas en WordPress. Está pensado tanto para usuarios principiantes como para quienes solo quieren generar rápidamente la estructura necesaria sin crear los archivos manualmente.
El plugin permite establecer el nombre, la descripción y otros datos básicos del nuevo tema. Después genera los archivos necesarios y deja el tema hijo preparado para activarlo desde el apartado Apariencia > Temas.
Puede ser una buena opción cuando no necesitamos copiar muchas configuraciones ni realizar un análisis avanzado de la plantilla principal.
Generate Child Theme
Generate Child Theme es otro plugin ligero que permite crear un tema hijo de cualquiera de los temas instalados en la web. Su funcionamiento es bastante directo y está pensado para completar el proceso en pocos minutos.
Seleccionamos el tema padre, indicamos los datos del nuevo tema hijo y el plugin genera automáticamente su estructura. No ofrece tantas opciones como Child Theme Configurator, pero puede resultar suficiente para crear una base limpia sobre la que añadir nuestro CSS y las funciones personalizadas.
Child Theme Wizard
Child Theme Wizard permite crear un tema hijo con pocos pasos y personalizar algunos de sus datos antes de generarlo. Es una alternativa sencilla cuando solo queremos obtener los archivos básicos y comenzar a trabajar.
Su principal ventaja es la facilidad de uso. Sin embargo, antes de elegir un plugin también debemos comprobar que se encuentra actualizado y probado con una versión reciente de WordPress, especialmente si vamos a utilizarlo en una tienda online o en una web que está recibiendo visitas.
Create Block Theme para temas de bloques
Si estamos trabajando con un tema de bloques y el editor completo del sitio, también podemos valorar Create Block Theme. Este plugin permite crear un tema nuevo, generar un tema hijo a partir de la plantilla activa y guardar dentro del tema los cambios realizados desde el editor de WordPress.
Está más orientado al sistema moderno de edición por bloques que a las plantillas clásicas. Por ese motivo, no siempre será la opción adecuada para una web creada con un tema tradicional como Kadence, Astra o GeneratePress, pero puede resultar muy útil en proyectos desarrollados íntegramente con el editor del sitio.
Qué plugin recomendamos para crear un tema hijo
Para la mayoría de los proyectos seguimos recomendando Child Theme Configurator. Es una herramienta conocida, permite analizar la plantilla, ofrece opciones para copiar la configuración del tema padre y facilita bastante el proceso cuando la página ya está diseñada.
Crear un tema hijo con él es tan fácil como entrar en la configuración del plugin, seleccionar CREAR un nuevo tema hijo, analizar el tema que quieras usar y darle a crear, si tienes muy avanzada tu página web te recomiendo que selecciones siempre la opción de que copié todos los detalles del tema padre, y eso sería todo ya tendrías un tema hijo creado que puedes seleccionar en personalización/temas.
Si solo necesitamos crear rápidamente la carpeta y los archivos básicos, WP Child Theme Generator o Generate Child Theme pueden ser alternativas más sencillas.
En cualquier caso, el plugin únicamente es necesario durante la creación. Una vez generado y activado el tema hijo, podemos eliminarlo si no vamos a utilizar sus herramientas de configuración. El nuevo tema permanecerá dentro de wp-content/themes y continuará funcionando con normalidad.
Qué ocurre si cambiamos de plantilla
Cuando cambiamos el tema principal, el tema hijo anterior deja de utilizarse porque depende directamente de esa plantilla.
No podemos activar un tema hijo de Kadence sobre Astra, GeneratePress o cualquier otro tema. Tendremos que crear un nuevo tema hijo para la nueva plantilla y trasladar únicamente las modificaciones que sigan siendo necesarias.
Este es uno de los motivos por los que conviene separar correctamente las funciones.
Los estilos, plantillas y cambios relacionados con el diseño deben revisarse porque probablemente no funcionarán igual con el nuevo tema. En cambio, las funciones generales guardadas en Code Snippets pueden continuar activas sin necesidad de copiarlas.
Antes de cambiar una plantilla también debemos revisar el archivo functions.php del tema hijo antiguo y anotar todas las modificaciones personalizadas. No conviene copiar todo directamente sin comprobarlo, ya que algunas funciones pueden ser innecesarias, incompatibles o estar relacionadas con una estructura que ya no existe.
Una renovación de plantilla también puede ser una buena oportunidad para limpiar código antiguo y eliminar personalizaciones que WordPress, WooCommerce o el nuevo tema ya incluyen de forma nativa.
Mantener WordPress organizado para futuras modificaciones
Crear un tema hijo en WordPress no solo sirve para evitar que una actualización borre nuestros cambios. También nos ayuda a organizar mejor el desarrollo de la web y facilita mucho el mantenimiento a largo plazo.
Las páginas evolucionan, incorporan nuevas funciones y pueden cambiar varias veces de diseño durante su vida útil. Una web creada hace seis o diez años puede seguir generando contactos y ventas, pero probablemente necesite adaptarse a las tecnologías, dispositivos y hábitos actuales.
Si mantenemos separadas las modificaciones de diseño y las funciones generales, será mucho más sencillo actualizar la plantilla, corregir errores o renovar completamente la apariencia sin perder el trabajo realizado.
Nuestra recomendación es utilizar siempre un tema hijo para las modificaciones relacionadas con la plantilla y apoyarnos en Code Snippets para aquellas funciones que deban permanecer activas aunque el diseño cambie en el futuro.
También puedes consultar nuestro post sobre cómo añadir código PHP con Code Snippets y otros tutoriales de WordPress y WooCommerce en los que utilizamos funciones personalizadas para mejorar el diseño y el funcionamiento de una página web.en al actualizarlo.
En definitiva: ya sabes cómo crear un tema hijo para tu WordPress o WooCommerce
Ya has visto que crear un tema hijo en WordPress es bastante sencillo, tanto si prefieres utilizar un plugin rápido y eficiente como si te gusta hacerlo manualmente mediante código. Las dos opciones son válidas y permiten trabajar sobre la plantilla con mucha más seguridad, sin miedo a perder los cambios cada vez que llegue una actualización.
Además, utilizar un tema hijo nos ayuda a mantener la web mucho más organizada a largo plazo. Esto es especialmente importante en proyectos que pueden durar muchos años y que, con el tiempo, necesitan nuevas funciones, cambios de diseño o incluso una renovación completa de la plantilla.
También conviene combinar el tema hijo con herramientas como Code Snippets para guardar aquellas funciones que queremos conservar aunque cambiemos de tema en el futuro. De esta forma podemos separar las personalizaciones visuales de las funciones generales de WordPress o WooCommerce y tener siempre mucho más control sobre el proyecto.
En resumen, crear un tema hijo es una pequeña tarea que puede evitarnos bastantes problemas más adelante. Si vamos a realizar modificaciones sobre una página web, merece la pena hacerlo bien desde el principio y dejar preparada una estructura que podamos seguir utilizando y ampliando con el paso del tiempo.
Javier Callejo
En Javier Callejo ayudamos a empresas y negocios locales a mejorar su presencia online mediante diseño web en WordPress, SEO, contenidos y campañas de Google Ads orientadas a resultados.
