Versiones de versiones @import of style.css del tema principal

Mi respuesta anterior es demasiado complicada y posiblemente no respeta la cadena de dependencia del tema principal (vea la nota en otra respuesta).

Aquí hay otra toma mucho más simple que debería funcionar mucho mejor:

function use_parent_theme_stylesheet() {
    // Use the parent theme's stylesheet
    return get_template_directory_uri() . '/style.css';
}

function my_theme_styles() {
    $themeVersion = wp_get_theme()->get('Version');

    // Enqueue our style.css with our own version
    wp_enqueue_style('child-theme-style', get_stylesheet_directory_uri() . '/style.css',
        array(), $themeVersion);
}

// Filter get_stylesheet_uri() to return the parent theme's stylesheet 
add_filter('stylesheet_uri', 'use_parent_theme_stylesheet');

// Enqueue this theme's scripts and styles (after parent theme)
add_action('wp_enqueue_scripts', 'my_theme_styles', 20);

La idea es simplemente filtrar la llamada a get_stylesheet_uri() en el tema principal para devolver su propia hoja de estilo en lugar de la del tema secundario. La hoja de estilo del tema secundario se pone en cola más adelante en el gancho de acción my_theme_styles .

No tienes que usar @import. Es mejor no hacerlo, en realidad. El uso de un enfoque en cola es probablemente mejor en todos los aspectos.

Aquí está la parte relevante del código de veinte trece:

function twentythirteen_scripts_styles() {
...
    // Loads our main stylesheet.
    wp_enqueue_style( 'twentythirteen-style', get_stylesheet_uri(), array(), '2013-07-18' );
...
}
add_action( 'wp_enqueue_scripts', 'twentythirteen_scripts_styles' );

Esto es lo que haces en tu código:

function child_scripts_styles() {
    wp_enqueue_style( 'child-style', get_stylesheet_directory_uri().'/css/main.css', array('twentythirteen-style'), 'YOUR_THEME_VERSION' );
}
add_action( 'wp_enqueue_scripts', 'child_scripts_styles' );

Si su main.css tiene que venir después del style.css de los padres, entonces usted solo depende de eso.

Ahora, si también tiene un B.css en el hijo, configure las dependencias en consecuencia:

function child_scripts_styles() {
    wp_enqueue_style( 'child-B-style', get_stylesheet_directory_uri().'/B.css', array('twentythirteen-style'), 'YOUR_THEME_VERSION' );
    wp_enqueue_style( 'child-style', get_stylesheet_directory_uri().'/css/main.css', array('child-B-style'), 'YOUR_THEME_VERSION' );
}
add_action( 'wp_enqueue_scripts', 'child_scripts_styles' );

Haga que las dependencias que defina para cada elemento reflejen realmente lo que realmente son esas dependencias. Si main.css debe venir después de B.css, entonces depende de ello. Si B.css debe venir después del style.css del padre, entonces B depende de eso. El sistema de encolado lo resolverá por usted.

Y si en realidad no está usando el style.css del niño para nada, entonces no tiene que ponerlo en la cola . Puede ser solo un marcador de posición para mantener la información del encabezado de tu tema. ¿No lo usas? No lo cargues.

Además, ¿qué está haciendo exactamente que depende tanto del pedido aquí? A CSS no le importa el orden de carga en la mayoría de las situaciones. CSS es más dependiente de la especificidad de los selectores. Si desea anular algo, haga que su selector sea más específico. Puede aparecer primero, o por último, o cualquier otra cosa, el selector más específico siempre gana.

Editar

Leyendo sus comentarios y mirando más de cerca el código, veo dónde está el error aquí. El código veinte y trece está encolando el "get_stylesheet_uri ()", que en un caso de tema secundario, sería el archivo style.css del tema de su hijo, no el archivo principal. Es por eso que @import funciona y sigue el mismo ordenamiento (lo cual, de nuevo, no importa tanto como usted cree).

En ese caso, si no desea utilizar la importación, recomendaría poner en cola el style.css de los padres directamente. Al igual que:

function child_scripts_styles() {
    wp_enqueue_style( 'parent-style', get_template_directory_uri().'/style.css', array() );
}
add_action( 'wp_enqueue_scripts', 'child_scripts_styles' );

El código en las funciones.php del tema hijo se ejecuta primero, por lo que primero se ejecutarán tus propios wp_enqueue_scripts, y esto encolará el estilo.css del tema principal, que el tema principal no se está haciendo a sí mismo (porque en realidad es el estilo de tu hijo. css). Al no hacer que dependa de nada, igual que el padre, entonces simplemente se pone en la salida correctamente. Tenga en cuenta que el orden de este archivo y de genericons.css no importa, porque el "estilo veinte y trece" original no tiene genericons.css como una dependencia listada.

El estilo.css de su propio hijo se cargará, y honestamente, aquí es donde debe colocar los cambios para el tema del niño, no en un main.css separado. No hay nada que le impida colocar los cambios allí, pero no hay ninguna razón real para tener un archivo css adicional.

advertencia

Esta solución no respeta las dependencias del tema principal ! Cambiar el nombre del identificador del tema principal afecta a la cadena de dependencias establecida en el tema principal. Consulte mi mucho más simple otra respuesta .

respuesta original

Aunque la respuesta de Otto es bastante buena, terminé con esto en las funciones de mi hijo tema.php

function my_theme_styles() {
    global $wp_styles;
    $parentOriginalHandle = 'twentythirteen-style';
    $parentNewHandle = 'parent-style';

    // Deregister our style.css which was enqueued by the parent theme; we want
    // to control the versioning ourself.
    $parentStyleVersion = $wp_styles->registered[$parentOriginalHandle]->ver;
    $parentDeps = $wp_styles->registered[$parentOriginalHandle]->deps;
    wp_deregister_style($parentOriginalHandle);

    // Enqueue the parent theme's style.css with whatever version it used instead
    // of @import-ing it in the child theme's style.css
    wp_register_style($parentNewHandle, get_template_directory_uri() . '/style.css',
        $parentDeps, $parentStyleVersion);

    // Enqueue our style.css with our own version
    $themeVersion = wp_get_theme()->get('Version');
    wp_enqueue_style($parentOriginalHandle, get_stylesheet_directory_uri() . '/style.css',
        [$parentNewHandle], $themeVersion);
}

// Run this action action the parent theme has enqueued its styles.
add_action('wp_enqueue_scripts', 'my_theme_styles', 20);

Mantiene el número de orden y el número de versión de style.css del tema principal mientras controla la versión de style.css del tema principal.