Temas hijos (child themes)

🧩 ¿Qué es un tema hijo?

Un tema hijo te permite:

• Personalizar un tema sin perder los cambios al actualizarlo.
• Sobrescribir archivos del tema padre.
• Añadir estilos CSS o funcionalidades PHP adicionales.
• Trabajar de forma segura y organizada.

---

🛠️ ¿Por qué usar un tema hijo?

Ventaja	Explicación
🔒 Seguridad en las actualizaciones	Puedes actualizar el tema padre sin perder tus cambios.
🧑‍💻 Personalización limpia	Tus cambios se guardan aparte, en el child theme.
🧩 Sobrescribir archivos específicos	Puedes reemplazar solo una plantilla o función concreta.
🪄 Compatibilidad	Todo lo que no esté en el tema hijo se toma del padre.

---

📁 Estructura básica de un tema hijo

Supongamos que tu tema padre se llama twentytwentyfour.

Tu tema hijo tendrá esta estructura de carpetas y archivos:

wp-content/
└── themes/
    ├── twentytwentyfour/
    └── twentytwentyfour-child/
        ├── style.css
        └── functions.php

---

📝 Paso a paso para crear un tema hijo

1. 📂 Crear la carpeta del tema hijo

En wp-content/themes/, crea una carpeta con un nombre claro, como:

twentytwentyfour-child

---

2. 🧾 Crear el archivo style.css

Este archivo declara el tema hijo y su relación con el padre:

/*
Theme Name:     Twenty Twenty-Four Child
Theme URI:      https://tuweb.com
Description:    Tema hijo de Twenty Twenty-Four
Author:         Tu nombre
Author URI:     https://tuweb.com
Template:       twentytwentyfour
Version:        1.0.0
*/

/* Aquí puedes añadir tu CSS personalizado */
body {
  background-color: #f5f5f5;
}

🔔 IMPORTANTE:

• El campo Template debe tener exactamente el nombre de la carpeta del tema padre (twentytwentyfour).
• Theme Name es el nombre que aparecerá en el panel de WordPress.

---

3. 🧩 Crear el archivo functions.php

Este archivo sirve para cargar los estilos del padre y agregar código PHP extra.

<?php
// Cargar estilos del tema padre
add_action( 'wp_enqueue_scripts', 'child_theme_styles' );
function child_theme_styles() {
    wp_enqueue_style(
        'parent-style',
        get_template_directory_uri() . '/style.css'
    );

    // Si tienes estilos extra en el hijo, puedes añadirlos así:
    // wp_enqueue_style( 'child-style', get_stylesheet_uri(), array('parent-style') );
}

---

4. ✅ Activar el tema hijo

• Ve a Apariencia > Temas en tu panel de WordPress.
• Verás el nuevo tema hijo.
• Haz clic en Activar.

---

🧪 Opciones de personalización con un tema hijo

➕ Agregar estilos CSS nuevos (en style.css):

h1 {
  color: darkred;
}

✏️ Sobrescribir una plantilla (por ejemplo, header.php):

• Copia header.php del tema padre al tema hijo.
• Modifica lo que necesites (por ejemplo, cambia el logo o el menú).
• WordPress usará la versión del hijo.

⚙️ Agregar una función nueva (en functions.php):

// Añadir soporte para miniaturas destacadas
add_theme_support( 'post-thumbnails' );

---

🧠 ¿Cuándo conviene usar un tema hijo?

✅ Si vas a:

• Modificar archivos .php, como header.php, single.php, etc.
• Añadir funcionalidades nuevas con PHP.
• Aplicar CSS avanzado que podría requerir !important o sobrescritura.
• Mantener tus personalizaciones a salvo de actualizaciones del tema padre.

 

Child Themes