Cómo crear child themes en WordPress
¡Buenos días! Hoy vamos a ver cómo crear childthemes con plugin, sin plugin y cómo hacerlo específicamente para Genesis Framework. ¡Vamos allá!
Caso 1: Crear un childtheme para WordPress con plugin
Para crear un childtheme para WordPress con plugin seguimos estos pasos:
1. Descargamos, instalamos y activamos el plugin Child Theme Configurator.
2. Accedemos a las configuraciones del plugin en Herramientas > Child Themes.
3. Elegimos la opción CREATE a new Child Theme, elegimos el tema padre para el que queremos crearlo y le damos a Analyze.
4. En la sección 4 podemos darle un nombre personalizado a nuestro tema hijo, pero lo demás lo dejamos tal como viene por defecto.
5. Opcionalmente podemos activar la función en la sección 8 para importar las personalizaciones del tema padre, los menús, los widgets…
6. Le damos a Create New Child Theme ¡y ya esta!
Ahora si vamos a Apariencia > Temas veremos que nos aparece nuestro tema hijo. Veamos cómo hacer este mismo proceso de forma manual.
Caso 2: Crear un childtheme para WordPress manualmente (sin plugin)
1. Accedemos al directorio de temas (wp-content > themes) y creamos un carpeta para nuestro tema.
2. Accedemos a la carpeta del tema padre, copiamos los archivos style.css y functions.php y los pegamos en la carpeta del tema hijo. También podemos crearlos de cero pero es un método más rápido y ademas ya aprovechamos la cabecera de style.css del tema padre.
3. Dentro del archivo style.css añadimos la siguiente línea dentro del bloque de comentarios al principio del archivo: Template: carpeta-del-tema-padre. En el caso del vídeo como el tema padre es Twenty Seventeen, ponemos Template: twentyseventeen ya que es donde se encuentra el tema padre.
4. Borramos todo el resto de estilos del archivo style.css (si lo hemos importado desde la carpeta del tema padre).
5. Limpiamos el archivo functions.php y dejamos las siguientes líneas de código para importar los estilos del tema padre:
add_action( 'wp_enqueue_scripts', 'theme_enqueue_styles' );
function theme_enqueue_styles() {
wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/style.css' );}
¡Y ya estamos! Ya podemos activar nuestro tema y hacerle todas las modificaciones que queramos. ¡Pasemos a la creación de un tema hijo para Genesis!
Caso 3: Crear un childtheme para Genesis Framework
1. Accedemos al directorio de temas (wp-content > themes) y creamos un carpeta para nuestro tema.
2. Dentro de esa carpeta creamos un archivo style.css y otro archivo functions.php.
3. Dentro del archivo style.css añadimos el siguiente bloque de comentarios en la cabecera:
/* Theme Name: Nombre del tema Theme URI: https://nuestra-url.com/lo-que-sea Description: Descripción del tema Author: Nuestro nombre Author URI: https://nuestra-url.com/lo-que-sea Version: 1.0 Template: genesis */
Podemos modificar el nombre del tema, el nombre del autor… pero la parte de Template: genesis debemos dejarla tal como esta).
4. Dentro del archivo functions.php añadimos el siguiente código y guardamos:
<?php include_once( get_template_directory() . '/lib/init.php' ); define( 'Child_Theme_Name', 'Nombre del Theme' ); define( 'Child_Theme_Url', 'http://dominio.com' ); define( 'Child_Theme_Version', '1.0' ); add_theme_support( 'html5' ); add_theme_support( 'genesis-responsive-viewport' );
¡Y ya estamos! Ahora si volvemos y activamos el tema, veremos que la página nos carga sin estilos, ya que no hemos importado ninguno. Ahora lo que toca es diseñar nuestra propia plantilla 🙂
Ya hemos visto tres casos diferentes con los que nos podemos encontrar para crear temas hijo para WordPress. Si os preguntáis por qué no hay un caso de cómo hacerlo para Genesis con plugin, la respuesta es simple: sinceramente, si no estas preparado para tocar un poco el código, no utilices Genesis.
