Como crear un tema hijo en wordpress
Un tema hijo en wordpress. Muchas veces nos pasa, hemos realizado una instalación de wordpress, y tenemos un tema , plantilla o theme de wordpress instalado y personalizado. Pero por la razón que sea existe una actualización de este tema, procedemos con la actualización y al hacerlo, se nos sobreescribe toda la información personalizada que hubiéramos hecho en nuestro tema perdiendo toda la personalización, con lo que si no teníamos copia de seguridad debemos empezar de cero.
Lo mejor para realizar esta operación y lo que nos ofrece el gestor de contenidos wordpress para evitar este tipo de situaciones es crear un tema hijo con la personalización que queramos, de esta forma cualquier actualización o renovación del tema original no afectará al tema hijo o secundario creado a partir de éste. El tema hijo heredará la configuración del tema original o tema padre y además incorporará la configuración que le demos nosotros al tema hijo, a nivel de configuración de hoja de estilos css, …
Vamos a ver como se tiene que hacer esta operación:
En primer lugar procedemos a crear una carpeta con el tema que estemos utilizando, para esto lo mejor es acceder vía ftp a nuestro servidor y realizamos una copia de la carpeta del tema, que estará en la ruta /wp-content/themes/ la podemos llamar como queramos, pero estaría bien darle un nombre significativo , por ejemplo si nuestro tema se llama temawordpress, la carpeta que crearemos podría llamarse temawordpress-hijo.
Esta carpeta nueva, estará vacía y ahí podremos añadir los archivos que queramos, teniendo en cuenta que modificarán a los originales, por ejemplo si modificamos el archivo footer.php, éste nuevo modificará al que teníamos en nuestro tema original.
Si queremos personalizar la hoja de estilos css, tenemos que llevar un poco de cuidado, en este caso lo mejor es crear el fichero, style.css y éste nuevo fichero debe incluir una cabecera que indique que el tema nuevo es hijo del tema original.
Las cabecera incluirá unas directivas sobre el tema, las directivas más importantes son:
- Theme Name: <Nombre del tema hijo>
- Template: <Nombre del tema original del que hereda el tema hijo>
- @import url(<ruta al css del tema original del que hereda el hijo>)
Podemos incluir lo que queramos, nuestros créditos, datos de nuestro dominio,… hay que tener en cuenta de que estas directivas van en la cabecera y entre comentarios. Una vez incluida la cabecera ya podemos incluir las modificaciones que queramos al archivo css original
/*
Theme Name: Tema hijo
Template: Tema
@import url("../Tema/style.css")
NOTA: Al haber creado una carpeta en la carpeta themes debemos incluir la ruta relativa al style.css del tema original.
Aquí podríamos incluir directivas que queramos como
Author: Mi nombre
Description: Este tema es un hijo del tema original con nombre tema
....
*/
/* A continuación ya podemos modificar el css como queramos*/
Una vez creado este nuevo archivo css si vamos al menú Apariencia de worpdress y accedemos a temas, en los temas instalados ya podremos seleccionar el tema hijo que acabamos de crear y activarlo.
Como comentábamos antes, si queremos modificar el archivo footer.php original lo mejor es que copiemos el archivo original en la nueva carpeta del tema hijo y lo modifiquemos, teniendo en cuenta de que éste nuevo machacará o sobrescribirá el archivo que teníamos antes que no tendrá vigencia. Lo mismo para el header.php, o cualquier archivo que deseemos tocar del tema original.
Si además queremos tocar el archivo functions.php del tema original, (se nos puede ocurrir que no muestre los posts de una determinada categoría una determinada función, o que muestre la imágen de una forma o de otra) debemos proceder de la misma forma, creamos el archivo functions.php y añadimos la nueva función que queramos.
El funcionamiento de un tema hijo en wordpress y la secuencia de funcionamiento es la siguiente:
- WordPress carga el tema activo (si hemos activado el tema hijo nuevo, cargará este nuevo) , se accede al archivo style.css y detecta en la cabecera la directiva Template que hace referencia al tema original.
- WordPress carga la hoja de estilos que marca la cabecera del style.css a importar, en este caso
@import url("../Tema/style.css") - Carga la hoja de estilos del tema hijo y los archivos modificados del tema hijo
- Una vez los ha cargado carga los archivos originales del tema padre, tanto la hoja de estilos como los archivos originales del tema padre, footer.php, header.php,…
- Luego carga el fichero functions.php con las funciones modificadas del tema hijo y luego el functions.php del tema padre original.
Una vez tenemos esto veremos que podremos hacer cualquier actualización del tema original sin temer que las modificaciones que hayamos hecho en el tema original se pierdan, ya que las modificaciones las haremos sobre el tema hijo y no sobre el tema padre.
Personalmente me parece una buena forma de solucionar el tema y queda bastante bien, siempre podremos exportar nuestro tema hijo o incluirlo como personalización del tema original para otros usuarios de la comunidad wordpress.