¿Cómo crear e instalar un Tema Hijo en WordPress?

1. Introducción

En ocasiones tenemos la necesidad de hacer ciertas modificaciones y/o ajustes a nuestro Tema Padre (Tema principal), esos que Instalamos y Activamos una ves que los descargamos de la galería de Temas en WordPress, pero nos llevamos la sorpresa de que después que los instalamos existe una nueva versión del Tema y nos pide actualizar y aquí es donde viene el problema. Si por alguna razón se nos ocurrió estar modificando las CSS, la programación en PHP, los JS, etc… podríamos perder todas nuestras modificaciones realizadas.

El Tema Hijo se crea precisamente para evitar que esto nos pueda ocurrir y nos de un gran dolor de cabeza, si eres precavido e hiciste un respaldo de todo antes de actualizar, muy bien por ti, pero y si por alguna razón esto se nos paso por completo? o nos olvidamos de respaldar algunas de las modificaciones que hicimos?

De echo es altamente recomendado crear un tema hijo y no andar modificando el Tema Padre aunque seamos muy buenos en CSS, JS, PHP, etc… eso no tiene nada que ver, se trata de organización, precaución y orden.

2. Crear un Tema Hijo

Lo primero que tenemos que hacer es crear manualmente 2 archivos: uno llamado style.css y el otro llamado functions.php.

El archivo de style.css debe de contener como mínimo lo siguiente:

/**
 * Theme Name: Nombre del Tema Hijo
 * Template:   twentytwentyfour
 * ...other header fields
 */

Donde Theme Name: contiene el nombre del Tema Hijo y Template: contiene el nombre del Tema Padre, no olvidar que el nombre del Tema Padre debe de ser idéntico a como se llama la carpeta que contiene el Tema padre.

Siempre es recomendable completar con mas información las características del Tema Hijo como lo podemos ver a continuación

/*
Theme Name: Tema hijo de Twenty Twenty-four para pruebas
Template:   twentytwentyfour
Author: Jesus Serrano 
Author URI: https://markits.com.mx
Description: Tema hijo para ajustes adicionales
Requires at least: 6.4
Tested up to: 6.5
Requires PHP: 7.0
Version: 1.0
 */

En cuanto al archivo llamado functions.php este puede ir vacío, pero no olvides cargar el archivo style.css desde aquí cuando empieces a darle un estilo personalizado a tu tema, un ejemplo seria como el código que te dejo a continuación.

<?php
/**
 * Tema hijo Twenty Twenty-four Theme functions and definitions
 *
 * @link https://developer.wordpress.org/themes/basics/theme-functions/
 *
 * @package Tema hijo de Twenty Twenty-four
 * @since 1.0.0
 */

/* Define Constants */
define( 'CHILD_THEME_TWENTY_TWENTY_FOUR_VERSION', '1.0.0' );

/* Enqueue styles */
function child_enqueue_styles() {
	wp_enqueue_style( 'tema-hijo-de-twenty-twenty-four-theme-css', get_stylesheet_directory_uri() . '/style.css', array('twenty-twenty-four-theme-css'), CHILD_THEME_TWENTY_TWENTY_FOUR_VERSION, 'all' );
}

add_action( 'wp_enqueue_scripts', 'child_enqueue_styles', 30 );

Lo anterior te ayudará a cargar todo el contenido del archivo style.css si no lo hace no te funcionara tu contenido de tu CSS personalizado.

Hasta aquí vamos bien? si tienes dudas coméntamelo en la sección de comentarios. Necesitas ayuda? contáctanos.

3. Instalar Tema Hijo en WordPress

Lo primero que tenemos que hacer es ubicarnos en la ruta Apariencia > Temas y enseguida presionar el botón de Añadir un tema nuevo.

Después presionaremos el botón de Subir tema, pero antes de subirlo tendremos que crear un archivo .zip que contenga ambos archivos: style.css y functions.php

Archivo .zip ya creado

Después seleccionamos el archivo .zip al presionar el botón de subir tema

Seleccionamos el archivo .zip, presionamos el botón de Instalar ahora y esperamos a que WordPress lo instale

Y por ultimo, solo para verificar nos desplazamos a Herramientas > Editor de archivos del tema y listo.

Revisamos las características del Tema Hijo instalado y activado en Apariencia > Temas > Detalles del Tema

4. Conclusiones

La creación y la instalación de un Tema Hijo es algo que debemos de hacer si no deseamos perder información y/o ajustes a nuestro Tema Padre y tener un gran dolor de cabeza y perdida de tiempo teniendo que volver a realizarlos de nuevo, es un paso crucial antes de modificar nuestro tema ya instalado a nuestro gusto o al gusto de nuestro cliente, casi ningún Tema Padre va a cubrir todas nuestras expectativas al 100% una vez instalado y activado, a no ser que nosotros mismos creemos el Tema Padre desde cero pero eso lo veremos ya en otro blog.

Te quedaste con dudas? coméntalo en la sección de comentarios.

Te sugerimos revisar también este otro blog.