Monthly Archives: November 2013

Cómo crear un tema hijo en WordPress

Una de las decisiones más importantes al crear un blog es el aspecto y el tema que vamos a usar. En wordpress hay muchos temas que pueden gustarnos más o menos, pero casi seguro que no cumplen al 100% lo que estamos buscando. así que seguro que tendremos que hacer modificaciones.  Vamos a ver porque los temas hijos en wordpress pueden facilitarnos la vida.

La primera opción que se te puede pasar por la cabeza es entrar en la máquina y modificar directamente los ficheros del tema que tienes instalado. Esto puede provocar un montón de problemas, ya que, olvidar un simple ‘?’ o borrar alguna condición que no teníamos claro para que servía puede hacer que tu blog quede inutilizado.

Pero bueno, supongamos que sabemos php, html y css y que los cambios que vamos a hacer en nuestro blog no van a provocar errores. Así que los hacemos, todo queda justo como queríamos, y dos días después wordpress o el tema del que partimos hace una actualización que añade nueva funcionalidad. ¿Que hacemos? ¿Actualizamos y perdemos nuestros cambios? ¿Nos quedamos eternamente desactualizados?

Para prevenir estos problemas hay que evitar modificar los ficheros originales del tema que queremos usar y crearnos nuestro tema hijo.

¿Cómo crear un tema hijo en wordpress?

Lo primero que debemos hacer es elegir un tema padre, del que, al principio vamos a heredar toda su funcionalidad, y que después podremos ampliar o modificar. En mi caso voy  a partir del tema Twenty Thirteen que es el que más se parece a lo que quiero para mi blog.

Para crear el tema hijo nos conectarnos a la máquina donde tengamos montado el wordpress, y accedemos a la carpeta wp-content/themes, en esa ruta vemos el listado directorios con los temas que tenemos instalados en wordpress. Creamos una carpeta nueva con el nombre del tema que queramos poner, en este caso tweentythirteen-child.

Una vez creada la carpeta, es necesario indicar que este tema va a ser el tema hijo de tweentythirteen, para ello creamos dentro de la carpeta tweentythirteen-child un fichero style.css con el siguiente contenido:

Con esto, ya tenemos creado el tema hijo que hereda toda la funcionalidad y aspecto del tema padre.

Si accedemos a la administración de wordpress aparecerá algo así:

 

Trabajando sobre el tema hijo

Una vez que tenemos creado el tema hijo podemos empezar a modificar su aspecto y funcionalidad. Para esto, dependiendo de lo que queramos hacer tendremos que trabajar de la siguiente forma:

  • Modificar estilos: En la hoja de estilos styles.css que hemos añadido a la carpeta del tema hijo podemos sobreescribir cualquier estilo que queramos del tema padre o añadir elementos nuevos.
  • Modificar fichero php (excepto functions.php): Cualquier fichero .php que esté en el tema padre puede ser sobreescrito en el tema hijo, para ello, simplemente hay que crearlo con el mismo nombre en la carpeta del tema hijo. Lo más recomendable es copiar el fichero del tema padre completo y modificarlo.
  • Añadir nuevos ficheros php: Si lo necesitamos podemos añadir ficheros .php nuevos que no estén en el tema padre.
  • Añadir funciones a functions.php: Este fichero se trata de una forma un poco especial, ya que este fichero es el único que no sobrescribe al fichero del tema padre. En concreto las funciones que declaremos en el tema hijo, se cargarán antes que las del tema padre.
    Si queremos añadir una función nueva, es necesario incluir un fichero functions.php en la carpeta del tema hijo con las etiquetas de php, de la siguiente forma: