Crear tema hijo en wordpress “child theme”

Todos los temas actuales de Wordpress, nos ofrecen una sección para personalizar la CSS del tema para que estas modificaciones no sean eliminadas al actualizar tema. En la mayoría de las ocasiones con esta opción será suficiente para poder tener el tema de Wordpress a nuestro gusto. Pero  puede ser que además de la CSS, necesitemos añadir, quitar o mover algún elemento HTML en los ficheros de Wordpress. Si modificamos código de los ficheros de Wordpress , al actualizar el tema, todas estas modificaciones serán ELIMINADAS¡. Para evitar esto es necesario crear un tema hijo o “child theme”. NO todos los temas de Wordpress lo permiten, pero aquí os dejo documentado como intentar hacerlo.

Lo primero que debemos hacer, para realizar un tema hijo o “child theme” es crear una carpeta, en /wp-content/themes. Podemos ponerle el nombre que queramos, pero siempre es mejor poner algo descriptivo, por ejemplo: nombretema-hijo.

Ahora, dentro de esa carpeta, crearemos la hoja de estilos, “style.css”, que es la que une el tema padre e hijo. En este nuevo fichero copiaremos la cabecera de la hoja de estilos del tema padre, y dejaremos estas líneas:

/*   
 Theme Name: gastefilo
Theme URI: http://themegrill.com/themes/spacious  
 Author: Raúl Pérez   
 Author URI: http://raulperez.tieneblog.net  
 Description: tema hijo para gastefilo by Raúl Pérez   
 License: GNU General Public License v2 or later   
 License URI: http://www.gnu.org/licenses/gpl-2.0.html
Template:spacious   
*/ @import url("../tema-padre/style.css");

/*----------------- Empieza a añadir cambios aquí abajo -------------------------------*/

Vamos a desglosar, que es cada línea de esta cabecera en la CSS y su importancia
Theme Name: se pone un nombre al tema hijo que estamos creando, podemos improvisar, es obligatorio.
Theme URI: se pone la URL del sitio del creador del tema padre, no es obligatorio
Author: nombre del autor del tema hijo, no es obligatorio.
Author URI: URL del sitio web del creador del tema hijo, no es obligatorio.
Description: descripción del tema hijo, no es obligatorio.
License: tipo de licencia del tema, no es obligatorio.
License URI: URL del sitio de la licencia, no es obligatorio.
Template: aquí debemos poner el nombre del tema padre, obligatoriamente.
@import url(): entre los paréntesis debemos poner la URL, de la css principal, del tema padre, es totalmente obligatorio.

Una vez correctamente editada esta información, sólo nos queda activar este tema hijo, en la sección de Apariencia->Temas. Ahora podemos hacer modificaciones en esta hoja de estilos, sin temer que se pierdan al actualizar.

child-theme

Además si aparte de realizar modificaciones en la hoja de estilos, necesitamos modificar código en cualquier fichero, utilizaremos también el tema hijo, para que las actualizaciones no nos hagan perder estos cambios. Para ello:
Si por ejemplo, necesitaríamos modificar el footer.php, lo copiaríamos dentro de la carpeta del tema hijo, y lo modificaríamos a nuestro gusto.

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *