Esto seguro que nos ha pasado a muchos cuando empezabamos a trabajar con WordPress.
Tenemos una instalación de wordpress ya terminada, hemos modificado el tema, cambiándole el CSS y algunos php para que quede todo como queremos. Una vez hecho todo, la web queda como queremos y estamos satisfechos y muy contentos por nuestro trabajo.
Pasan algunos meses, y existe una nueva versión del tema. Sin darnos cuenta, actualizamos el tema y todo lo que hemos hecho se pierde. ¿Por qué?.
Bueno, vamos por partes…
Los themes en una instalación de wordpress se guardan dentro de la carpeta /wp-content/themes/ y aquí, por cada tema que tenemos instalado hay una carpeta con su nombre, tal como se muestra en la siguiente imagen.
Como podeis ver, hay dos temas instalados, el Twenty Seventeen, tema que se instala por defecto en el WordPress y el tema Nirvana que es el que tenemos activado.
Si las modificaciones las hacemos en los ficheros del directorio nirvana (el style.css, algún php como el header.php o el footer.php….) cuando se actualiza este tema, todo se pierde. ¿Porqué?. Bueno, de manera rápida, la actualización de un theme, lo que hace es eliminar su directorio de la carpeta themes y descargarse el nuevo, con lo que todo lo que hayamos modificado se pierde.
Y después de esto, tirones de pelo, subimos el nivel de alerta a DEFCON-2, empezamos a buscar copias de seguridad, no las encontramos…… vamos, lo que viene siendo un pandemónium (confusión ruido, y a veces gritos)
Pero para casi todo en esta vida hay solución. Para este problema crearemos un theme child (tema hijo) del theme Nirvana.
Lo primero, es crear una carpeta dentro de la carpeta /wp-content/themes/, para lo cual necesitaremos acceso FTP a nuestro servidor. Lo que yo recomiendo es que el nombre de la nueva carpeta tenga algúna relación con el tema padre. En nuestro ejemplo, el tema padre se guarda en el el directorio nirvana, así que la nueva carpeta la voy a llamar nirvana-child (imaginación al poder 😆 ).
Despues de crear este directorio, hay que crear la hoja de estilos (style.css). Puedes copiar la cabecera del fichero style.css del tema padre y modificar, o crear una desde cero con las lineas justas. Esto último es lo que voy a hacer, y el fichero style.css quedaría así:
/*
Theme Name: Mi tema hijo
Theme URI:
Version: 1.0
Description: Tema hijo del tema Nirvana
Author: Yo mismo
Author URI: http://www.midominio.com
Template: nirvana
*/
@import url("../nirvana/style.css");
/*----------------- Empieza a añadir cambios aquí abajo -----------------*/
¿Que es lo que he cambiado?¿que es lo importante de este fichero?
@import url("../nirvana/style.css");, es donde le indicamos a nuestro tema de donde heredar la hoja de estilos del tema padre. En este ejemplo, le digo que busque en el directorio del tema padre (nirvana)También puedes guardar en el directorio una imagen llamada screenshot.png otra del mismo tamaño que la que tiene el tema padre. Yo recomiendo en este screenshot.png colocar una captura de como luce el tema, pero puedes poner lo que quieras en este png. Esta será la imagen que veras cuando abras el menú de WordPress Aparienica->Temas.
Y lo más importante: Al final hay que activar el tema hijo. Por cierto, hay que tener en cuenta que internamente el tema realmente se sigue llamando nirvana.
Con eso, se ha creado un tema hijo para una instalación de WordPress sin necesidad de saber nada de PHP.