Cómo crear un tema hijo en WordPress

WordPress permite la creación de temas hijo utilizando como base un tema, que vendría a ser el  tema padre. Esta analogía padre-hijo, facilita entender de que vá esta relación. El tema hijo hereda las características del tema padre, pero puede modificar funcionalidad y/o características del tema padre.

¿De qué sirve crear un tema hijo ?

Un tema hijo en WordPress es útil por una sencilla razón: actualizaciones. Si hacemos las modificaciones directamente sobre el código del tema, estás se evaporarán con la siguiente actualiación. Lo que nos lleva a la siguiente premisa:

Todas las modificaciones de un tema deben hacerse en un child theme

De este modo, nuestras modificaciones permanecerán intactas, incluso después de la actualización del tema principal. Esta es la forma que funcionan los famosos theme frameworks de WorPress como Genesis. En el sentido estricto son parent themes, todo el código base reside en el tema padre y el tema hijo modifica la apariencia.

Creando un tema hijo en WordPress

Crear un tema hijo  es algo sencillo y no requiere de mucho vodoo. Para los siguientes pasos, utilizaré el tema Twenty Eleven como conejillo de indias.

1. Primero tenemos que crear una carpeta dentro del directorio themes. El directorio themes se encuentra en wp-content/themes. Es recomendable no dejar espacios en el nombre de la carpeta, si necesitamos separar palabras, utilizar un guión (-). Por un tema de conveniencia, utilizar el nombre del tema padre seguido del nombre que utilicemos para nuestro child theme, aunque no es necesario hacerlo de esta manera, hacerlo así nos permite ordenar mejor nuestras carpetas y saber a simple vista cuál es el tema principal.
2. Dentro de la carpeta de nuestro tema hijo (twentyeleven-mytheme en este caso), crear un archivo style.css con el siguiente contenido:

Las líneas más importantes de este cabecera son:

Template -> Indica cuál es el tema padre/parent theme.

@import url(../twentyeleven/style.css);  -> Carga la hoja de estilos del tema padre.

Y como paso final, copiamos el archivo screenshot.png del tema padre dentro del directorio de nuestro child theme o podemos crear una con las mismas dimensiones.

Ahora vamos a Apariencia >> Temas y deberiamos ver nuestro flamante child theme, listo para activar.

 

Modificando el tema padre

Si queremos modificar nuestro tema agregando alguna función, la forma correcta de hacerlo es a través del functions.php. Creamos este archivo dentro de nuestro tema hijo y agregamos nuestra función aquí.

Por ejemplo, por defecto Twenty Eleven muestra las entradas completas. Si queremos mostrar sólo el extracto de cada entrada tenemos que hacer las siguientes modificaciones:

1. Copiar la plantilla content.php del tema padre.

2. Ubicar el bloque <div=entry-content>, dentro de este bloque encontraremos la function the_content(), que es la responsable de mostrar el contendio completo, debemos cambiarla por the_excerpt(), quedando así:

3. Creamos el archivo functions.php (si es que aún no lo hemos creado) y añadimos el siguiente código como contenido:

Lo que estamos haciendo es asegurarnos que el tema padre ha cargado su configuración y funcionalidad, enganchar el código para nuestro child theme y quitar el filtro excerpt_length del twenty eleven.

A continuación creamos nuestra propia función para el filtro excerpt_length y ahora podemos modificar la longitud de los extractos, Twenty Eleven tiene este límite en 40, y por defecto en WordPress es 55.

Conclusión

No he tocado temas como internacionalización de nuestro child theme, tampoco cómo permitir que el tema padre permita que el tema hijo sobreescriba ciertas funciones ya que son temas un poco más avanzados. Como hemos visto, podemos modificar un tema a través de un tema hijo en WordPress, el proceso es sencillo y una vez que tenemos nuestro child theme creado, el proceso pasa por agregar/quitar funciones a través del archivo functions.php, y copiar las plantillas del tema padre y hacer las modificaciones que necesitemos. Las modificaciones en cuanto a estilo (CSS) deben ir en el archivo style.css de nuestro child theme. ¿Cómo saber qué modificar? Es necesario tener conocimiento de  la jerarquía para plantillas de WordPress.

Hola, soy Víctor Saldarriaga, Programador Web en continuio entrenamiento. Este es mi rincón digital sobre programación PHP y otras salsas. Más info en el apartado sobre mí o si tienes algún proyecto del que quieras hablar o simplemente decir hola :) puedes hacerlo a través del formulario de contacto.

Servicios AutoSEO

IMPULSA tu sitio web al TOP de Google, Yahoo y Bing. Seleccione uno de nuestros servicios y ¡disparar tu ranking!.

Ofrecemos servicios profesionales de SEO que ayudan a los sitios web a aumentar drásticamente su puntaje de búsqueda orgánica para competir por los rankings más altos en los buscadores. incluso cuando se trata de palabras clave altamente competitivas.

Más de nuestro blog

See all posts
 

Realice un comentario