Cómo incluir los estilos CSS en el tema hijo

functions_php_importar_estilos

Cuando se crea un tema hijo en WordPress, hay que tener unas cuantas cosas presentes, pero la más importante es quizás tener en cuenta que hay que importar los estilos CSS del tema padre. Entonces, la pregunta clara es: ¿cómo incluirlos en el tema hijo?

Cómo no hacerlo

La forma más sencilla y que más fácilmente se encuentra en Internet es la de usar la regla @import en el archivo style.css del tema hijo:

@import url('../mi_tema/style.css');

Esa forma no es la recomendada actualmente, debido a que aumenta el tiempo de carga de la página web y no funciona bien en navegadores antiguos.

La manera correcta

Entonces, la forma correcta de incluir los estilos CSS en el tema hijo es la siguiente:

  1. Abrimos el archivo functions.php de nuestro tema hijo.
  2. Añadimos el siguiente código:
 /* Importando estilos CSS 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' );
    if ( is_rtl() ) {
        wp_enqueue_style( 'parent-style-rtl', get_template_directory_uri() . '/rtl.css' );
    }
}

Además, con el código de arriba también estaremos importando los estilos para idiomas RTL (hebreo, árabe…).

(Fuentes: Ulrich y el propio WordPress)

Deja un comentario


He leído y acepto la política de privacidad