¿Qué es un Child Theme en WordPress y cómo crear uno paso a paso?

turned-on monitor displaying digital products

Un Child Theme (Tema Hijo) es una copia modificable de un Parent Theme (Tema Padre). Sirve para Un Child Theme en WordPress (tema hijo) es una técnica avanzada pero esencial que permite personalizar un tema sin modificar el tema original, también conocido como tema padre (Parent Theme). Esto es crucial para conservar tus cambios incluso cuando el tema padre se actualiza.

En este artículo aprenderás qué es un Child Theme en WordPress, para qué sirve, cómo crearlo desde cero y cómo evitar errores comunes durante su implementación.


¿Por qué usar un Child Theme en WordPress?

Utilizar un Child Theme en WordPress te permite:

  • Personalizar la apariencia de tu sitio web sin tocar el código del tema original.
  • Conservar tus personalizaciones aunque el tema padre se actualice.
  • Agregar funciones específicas para tu sitio sin comprometer la estabilidad del tema principal.

Esto es especialmente útil si estás construyendo un blog, una tienda online o cualquier otro proyecto que requiere personalizaciones visuales o funcionales específicas.


Estructura básica de un Child Theme en WordPress

Un Child Theme en WordPress debe contener, como mínimo, dos archivos:

  1. style.css – donde defines los estilos y metadatos del tema hijo.
  2. functions.php – encargado de heredar los estilos del tema padre y agregar nuevas funcionalidades.

También puedes copiar y modificar archivos adicionales del tema padre como header.php, footer.php o single.php, dependiendo del nivel de personalización que desees.


Cómo crear un Child Theme en WordPress paso a paso

Paso 1: Crear la carpeta del tema hijo

  1. Accede a la carpeta /wp-content/themes/ en tu instalación de WordPress.
  2. Crea una nueva carpeta con el nombre del tema padre seguido de -child.

Ejemplo:
Si tu tema padre es hestia, crea la carpeta hestia-child.


Paso 2: Crear el archivo style.css

Dentro de tu nueva carpeta, crea un archivo llamado style.css y añade el siguiente contenido:

cssCopiarEditar/*
Theme Name: Hestia Child
Theme URI: https://tudominio.com
Description: Tema hijo de Hestia
Author: Tu Nombre
Author URI: https://tudominio.com
Template: hestia
Version: 1.0.0
*/

Importante:
El valor de Template: debe coincidir exactamente con el nombre de la carpeta del tema padre. Si estás utilizando el tema oceanwp, entonces debe ser Template: oceanwp.


Paso 3: Crear el archivo functions.php

En la misma carpeta, crea un archivo functions.php con el siguiente código:

phpCopiarEditar<?php
function child_theme_styles() {
    wp_enqueue_style('parent-style', get_template_directory_uri() . '/style.css');
    wp_enqueue_style('child-style', get_stylesheet_directory_uri() . '/style.css', array('parent-style'));
}
add_action('wp_enqueue_scripts', 'child_theme_styles');

Este código asegura que el tema hijo cargue correctamente los estilos del tema padre.


Paso 4: Activar el Child Theme en WordPress

  1. Ve al Escritorio de WordPress → Apariencia → Temas.
  2. Busca el nuevo tema hijo (Hestia Child, por ejemplo).
  3. Haz clic en “Activar”.

Ejemplos prácticos de personalización en un Child Theme

Personalizar el archivo style.css

cssCopiarEditarh1 {
    font-size: 2.5em;
    color: #333;
}
body {
    background-color: #f4f4f4;
}

Modificar archivos de plantilla

Puedes copiar archivos del tema padre al hijo para modificarlos. Por ejemplo:

  • header.php para personalizar el encabezado.
  • footer.php para añadir derechos de autor o enlaces personalizados.
  • template-parts/ para cambiar la estructura de las entradas o páginas.

Solución a errores comunes con estilos en Child Themes

Si los estilos no se aplican correctamente después de activar tu Child Theme en WordPress:

  • Verifica que Template: en style.css coincida con la carpeta del tema padre.
  • Borra la caché del navegador y del plugin de caché si estás usando uno.
  • Asegúrate de que functions.php esté correctamente configurado.
  • Revisa la consola del navegador para ver si hay errores en la carga de archivos CSS.
  • Comprueba que ningún plugin esté interfiriendo con los estilos.

Recursos recomendados sobre Child Themes

Si deseas aprender más sobre cómo usar un Child Theme en WordPress, consulta estas fuentes:


Conclusión

Implementar un Child Theme en WordPress es una de las mejores prácticas para desarrolladores y diseñadores que desean crear sitios web personalizados sin comprometer la estabilidad del tema principal. Al seguir estos pasos podrás trabajar con confianza, mantener tus cambios a salvo y tener total libertad para adaptar el sitio a las necesidades de cada proyecto.

¿Listo para llevar tus personalizaciones al siguiente nivel? Empieza ahora creando tu primer Child Theme en WordPress.

Te puede interesar...

Deja un comentario