+34 650908608 [email protected]
Alineación vertical en DIVI

¿Child theme, y eso que es?

Crear un child theme es básico para cualquier plantilla de WordPress en el que queramos tener un resultado personalizado.

Un tema hijo o child theme, es necesario si queremos hacer modificaciones de estilo, o en las funciones de nuestro tema, pues al actualizar si no tenemos un child theme estos cambios se perderán.
A continuación te enseñaremos como hacer uno sin necesidad de plugins.

El child theme es un tema que utiliza todos los archivos de el tema original o tema padre, con esto simplemente crearemos una  que irá por encima de el tema que tengamos instalado. Y además podremos añadir funciones nuevas pos si sentimos que faltan cosas que queramos hacer en nuestro tema.

No será muy complicado…

Esto puede parecer muy complicado a si no sabes como funciona, en mi caso al principio descargaba child themes por no complicarme, pero una vez vi como se hace, la verdad que tardas más en encontrar uno que en crearlo tú mismo.

Primer paso

Bien lo primero que haremos será crear una carpeta dentro de nuestra instalación de WordPress, ya sea vía FTP por Filezilla o bien a través del FTP de nuestro hosting, esto es indiferente.
Buscaremos la siguiente ruta wp-content/themes y crearemos la carpeta con el nombre que le queramos dar a nuestro tema hijo, en este caso será “Child”.

Tutorial Alineación vertical - No alineado

Segundo paso

A continuación crearemos un pequeño archivo styles.css con una configuración así:

/*
Theme Name: CreandoWP
Theme URI: https://creandowp.es
Version: 1.0
Description: Descripción que se quiera poner
Author: CreandoWP
Author URI: https://creandowp.es
Template: Divi
*/
 
/*----------------- Cambios a partir de aquí -------------------------------*/

Las partes importantes que tienes que editar son:

  • Theme name: Este será el nombre de tu theme hijo
  • Template: Aquí tiene que ir el nombre exacto de la carpeta del theme padre

El nombre del template es vital, porque dará a tu child theme el mismo aspecto que tiene el theme padre.

Los demás datos son descriptivos y puedes poner lo que quieras.

Tercer paso

Una vez hemos creado nuestra hoja de estilos, simplemente tendremos que crear un archivo functions.php. Antes se importaban los estilos del tema padre a través del archivo style.css utilizando el @import, pero según WordPress esta práctica no es la recomendable

Anteriormente se solía importar el archivo style.css del tema padre utilizando @import pero según el codex de WordPress, esto ya no es la mejor práctica (aunque sigue funcionando).

Para  hacerlo con el mejor rendimiento posible, debes crear un archivo llamado functions.php dentro de la carpeta de tu child theme y escribir las siguientes líneas.

<?php
function my_theme_enqueue_styles() {

 $parent_style = 'parent-style'; // Estos son los estilos del tema padre recogidos por el tema hijo.

 wp_enqueue_style( $parent_style, get_template_directory_uri() . '/style.css' );
 wp_enqueue_style( 'child-style',
 get_stylesheet_directory_uri() . '/style.css',
 array( $parent_style ),
 wp_get_theme()->get('Version')
 );
}
add_action( 'wp_enqueue_scripts', 'my_theme_enqueue_styles' );
?>

¡Tachán!

Con esto ya tendremos funcionando nuestro child theme, pero vamos a darle la puntilla y vamos a darle los últimos acabados para que este tema parezca un tema profesional.

Y para esto vamos a crear una imágen destacada, lo único que tenemos que hacer es crear una imágen que se llame screenshot.png y la meteremos dentro de la carpeta de nuestro tema hijo. Desde CreandoWP recomendamos que esta imágen sea en proporción 1:1 y si puede ser de 800x800px mejor que mejor.

Child theme