¿Qué es un child theme?

Un child theme de WordPress, o tema hijo en español, es un tema que hereda todas las funcionalidades, características y estilos de su tema “padre”.

Un tema de WordPress está compuesto por varios archivos PHP, que es donde están programadas todas sus funcionalidades, y uno o varios archivos CSS, que es donde vienen definidos todos los estilos del tema (colores, tamaños, posiciones de los elementos, etc).

En un mundo sin child themes, en el caso de que quisieras hacer algún cambio en la plantilla, tendrías que editar el archivo correspondiente del tema hasta dejarlo a tu gusto.

Los cambios se verían reflejados en tu web, pero duraría solo unos días o semanas, concretamente hasta la próxima actualización de la plantilla.

Al actualizarla, los archivos nuevos sobreescribirían a los viejos, por lo que los cambios que hiciste se irían a un mundo mejor, y tendrías que volver a editar los archivos correspondientes.

Y así cada vez que hubiera una actualización del tema.

¿Quieres lo mejor para tu web y tu proyecto online?

Pues será mejor que eches un ojo a las mejores herramientas de creación y diseño web.

Luego no digas que no te lo advertí...

Los temas hijo se crearon para evitar esa incómoda situación.

Cómo funcionan los child themes y qué ventajas tienen

Los temas hijo se instalan y se activan como si fueran cualquier otra plantilla.

Pero a priori únicamente están compuestos de uno o dos archivos: el style.css y el functions.php, que son los dos archivos que más se utilizan para hacer cambios en la plantilla.

Las plantillas de WordPress normalmente utilizan el archivo style.css para definir todos los estilos de la web, que son los principales cambios que se hacen en una web cuando se quiere personalizar al gusto.

El archivo style.css del tema hijo está creado para heredar todos los estilos de su tema padre mediante una llamada a su carpeta.

Una vez hecha esta llamada, podrás realizar los cambios que quieras tanto en el archivo style.css y en el functions.php, así como en el resto de archivos que añadas al tema hijo.

Cada vez que quieras modificar el estilo de algún elemento de tu web y crear o eliminar una función, tendrás que escribir los cambios en los archivos de tu child theme.

De esta manera, al actualizar la plantilla padre o principal de tu web, los cambios que hayas hecho se mantendrán.

Cómo crear un tema hijo

Crear un child theme es fácil y tienes varias maneras de hacerlo.

Los creadores de algunas plantillas ponen a disposición de sus usuarios temas hijo ya creados para que solo se tengan que preocupar de instalarlo y empezar con los cambios. Es el caso por ejemplo de la plantilla GeneratePress.

Si la plantilla que utilizas no dispone de un tema hijo, te toca crearlo a ti.

Vamos a ver un par de maneras para hacerlo fácilmente.

1. Manualmente

Para crear un child theme manualmente, tienes que conectarte mediante FTP a tu sitio web y dirigirte a la ruta /wp/content/themes.

Crea una nueva carpeta y ponle de nombre algo que te haga ver de un vistazo que se trata del tema hijo de tu tema actual, como por ejemplo: nombre-child.

Ya vas casi por la mitad del proceso.

Ahora, entra en la carpeta, crea un nuevo archivo y ponle de nombre style.css.

A continuación puedes copiar y pegar este código dentro del archivo style.css, y veremos qué tienes que modificar para adaptarlo a tu tema actual.

 

/*

Theme Name:   Divi Child

Theme URI:    http://urldelcreador.com

Description:  Divi child theme

Author:       Sergio Gómez

Author URI:   https://lawebdetuvida.com

Template:     divi

Version:      0.1

*/

@import url(“../Divi/style.css”);

/* Escribir a partir de aquí el código personalizado */

 

¿Has copiado el código ya en el style.css de tu tema hijo?

¡Genial!

Ahora solo tienes que cambiar los datos que aparecen por los tuyos.

Las líneas Theme Name, Theme URL, Description, Author, Author URL y Version, son irrelevantes, no importa lo que pongas en ellas.

Las importantes son dos:

  1. Template: escribe el nombre de la carpeta de tu tema actual.
  2. @import url(“../Divi/style.css”); tiene que apuntar al archivo style.css del tema actual.

Ya está. Ya tienes tu tema hijo creado.

A partir de esas líneas ya puedes escribir tu código CSS personalizado.

Ahora puedes crear un archivo llamado functions.php en la misma carpeta, y en él copia lo siguiente:

 

<?php

// Escribir a partir de aquí el código personalizado

?>

 

Por último, dirígete al panel de administración de WordPress, haz clic en  “Apariencia – Temas” y activa el child theme que acabas de crear.

2. Mediante un plugin

Si pasas de entrar por FTP a tu web y de crear tú mismo los archivos, puedes recurrir a algunos de los plugins que existen para crear temas hijo.

No es la opción recomendada, pero será más fácil si tienes miedo a tocar donde no debes.

Por ejemplo, puedes utilizar el plugin Child Theme Configurator o One-Click Child Theme.