Crear Tema Hijo en WordPress

Crear Tema Hijo en WordPress

Creando Temas Hijos en WordPress

Muchas veces necesitamos realizar cambios a nuestro sitio wordpress. Si son pequeños cambios el problema no parecería ser mayor. Pero aún en estos cambios hay que tener una consideración especial.

Si modificamos el tema de wordpress en si mismo, cualquier nueva actualización sobreescribirá estos mismos. Es por ello que existen los child themes (temas hijos), así evitamos que los cambios anteriores se pierdan.

Pasos a seguir:

1 – Crear dentro de wp-content/themes una carpeta nueva con cualquier nombre. Lo ideal sería usar «nombredetemapadre-child» ya que podríamos tener varios temas y nos resultaría mas simple identificarlos después.

2 – Una vez creada la carpeta necesitamos crear un archivo dentro de la misma llamado «style.css» con el siguiente código dentro.

/*
Theme Name: Nombre Theme Hijo (Puede llevar espacios)
Theme URI: http://www.marioblock.com.ar
Version: 1.0
Description: Tema hijo de "Nombre Theme Padre" para hacer cambios sin riesgo alguno
Author: Mario Block
Author URI: http://www.marioblock.com.ar
Template: Nombre Theme Padre
Text Domain: Nombre Theme Hijo (minúsculas y sin espacios)
*/

@import url("../nombrethemepadre/style.css");

/*----------------- Empieza a añadir cambios aquí abajo -------------------------------*/

Con ese archivo archivo solo se podría subir tranquilamente y ya tendríamos un tema hijo. Pero el método @import no es recomendable para cargar estilos css, ya que consume mas recursos y por ende mas tiempo. La forma correcta de agregar estilos a nuestro tema es mediante las funciones provistas por wordpress.

Las funciones serían wp_enqueue_scripts action y wp_enqueue_style(). Ambas provistas por wordpress para encolar en forma correcta los scripts y los estilos.

Si tu tema padre contiene código css también deberás encolarlo. Seteando ‘parent-style’ como dependencia te asegurará que el css hijo se cargue después que este.  El código completo sería el siguiente.

<?php
function my_theme_enqueue_styles() {

    $parent_style = 'parent-style'; // This is 'twentyfifteen-style' for the Twenty Fifteen theme.

    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' );
?>

Tu tema hijo esta listo para la activación. Ve a apariencia->temas y activa el creado anteriormente. Puedes llegar a necesitar salvar el menú nuevamente y las opciones del theme. Para ello ve a Apariencia->Menú y salvalo nuevamente, lo mismo para las opciones del tema padre.