Assegnare un numero di versione al foglio di stile principale di un tema child

Penso che il modo migliore per farlo sia lasciare il foglio di stile del tema figlio (style.css) vuoto con solo i commenti necessari (come nome del tema, descrizione ecc., così che WordPress possa riconoscere il tuo tema) e poi creare un altro file css nella cartella del tuo-tema/css/main.css

Dopodiché nel file function.php puoi avere una nuova "versione" ogni volta che modifichi il tuo file:

function my_scripts_and_styles(){

$cache_buster = date("YmdHi", filemtime( get_stylesheet_directory() . '/css/main.css'));
wp_enqueue_style( 'main', get_stylesheet_directory_uri() . '/css/main.css', array(), $cache_buster, 'all' );

}

add_action( 'wp_enqueue_scripts', 'my_scripts_and_styles', 1);

La logica:

Ogni volta che salvi il file, il tempo di modifica del file viene cambiato. Il nuovo tempo viene passato alla funzione date per convertire il tempo (filemtime restituisce un intero che rappresenta il tempo) in un formato data per renderlo una stringa nel formato desiderato. Nel nostro esempio il tempo viene formattato con una precisione al minuto. Puoi modificarlo per tracciare anche i secondi, ad esempio "YmdHis". Successivamente, il nuovo tempo di modifica del file viene passato come nuova versione a wp_enqueue_style.

Riferimenti:

http://www.php.net/filemtime

http://php.net/manual/en/function.date.php

Quello che devi fare è deregistrare lo stile principale tramite il suo handle e poi registrarlo nuovamente con il tuo numero di versione. In questo caso l'handle è style-css.

Puoi determinare l'handle da utilizzare guardando il link del foglio di stile renderizzato:

<link rel='stylesheet' id='style-css-css'  href='http://site-url/wp-content/themes/child-theme/style.css?ver=4.6.1' type='text/css' media='all' />

Qui l'id è style-css-css il che significa che il nostro handle è style-css

Inserisci questo nel file function.php del tuo child-theme:

function wpse_145141_change_style_version(){
    // Prima deregistra il foglio di stile principale
    wp_deregister_style( 'style-css' );
    // Poi aggiungilo nuovamente, usando il tuo numero di versione personalizzato
    wp_register_style( 'style-css', get_stylesheet_uri(), array(), "VERSION_NUMBER" );
    // Infine eseguine nuovamente l'enqueue
    wp_enqueue_style( 'style-css');
}

add_action( 'wp_enqueue_scripts', 'wpse_145141_change_style_version');

La risposta attualmente più votata dipende dal tema, poiché richiede che lo sviluppatore del tema abbia reso quella versione del tema figlio una variabile e poi l'abbia aggiunta al file child style.css quando lo carica. Ho visto questo approccio in alcuni temi, ma non in molti. Il metodo seguente funziona con qualsiasi tema che registri gli stili del tema figlio in functions.php - non funziona con la vecchia regola @import, che ormai non si vede quasi più.

Nel file functions.php del tema figlio, dovresti avere qualcosa di simile a questo:

// carica il foglio di stile del tema figlio

function wp_schools_enqueue_scripts() {
  wp_register_style( 'childstyle', get_stylesheet_directory_uri() . '/style.css'  );
  wp_enqueue_style( 'childstyle' );
}
add_action( 'wp_enqueue_scripts', 'wp_schools_enqueue_scripts', 11);

Se lo modifichi come segue, aggiungerà un timestamp come numero di versione ogni volta che il file viene salvato, permettendo a ogni modifica del foglio di stile di bypassare la cache locale:

 // carica il foglio di stile del tema figlio

 function wp_schools_enqueue_scripts() {
   wp_register_style( 
     'childstyle', 
     get_stylesheet_directory_uri() . '/style.css', 
     array(), 
     filemtime( get_stylesheet_directory() . '/style.css' ) 
   );
   wp_enqueue_style( 'childstyle' );
 }
 add_action( 'wp_enqueue_scripts', 'wp_schools_enqueue_scripts', 11);

Spero che questo sia utile a qualcuno. Io lo uso in ogni sito che gestisco attivamente.

Invece di usare il file style.css predefinito, solitamente utilizzo wp_enqueue_style nel functions.php del tema figlio o in un altro file php incluso. Quindi, avresti comunque il file style.css nel tema figlio con tutti i dettagli del tema figlio, ma poi puoi avere un file css separato nel tema figlio per lo stile effettivo del tema figlio (di solito lo metto in una directory assets/css all'interno del tema figlio). Questo ti permetterebbe anche di impostare la versione del CSS con il 4° parametro. Ad esempio:

function theme_name_child_scripts() {
    wp_enqueue_style( 'style-name', get_stylesheet_directory_uri() . '/assets/css/child-style.css', array(), '1.0.0', 'screen');
}

add_action( 'wp_enqueue_scripts', 'theme_name_child_scripts' );

Puoi aggiungere una priorità all'azione se non viene caricata nell'ordine corretto o lavorare con il parametro di dipendenza in wp_enqueue_style sopra:

add_action( 'wp_enqueue_scripts', 'theme_name_child_scripts', 20 );

Utilizza filemtime per versionare in base alle modifiche del file. Deregistra e ricarica lo stile.

1. Cerca nel sorgente (ctrl + U) e trova l'ID CSS del tema figlio senza "-css". In questo caso è voyager-default

<link rel='stylesheet' id='voyager-default-css' href='/wp-content/themes/voyager-child-theme/style.css?1606484598' type='text/css' media='all' />

2. Usa questo codice (fonte) ma sostituisci 'style' con la stringa trovata (qui 'voyager-default')

functions.php del tema figlio

function add_timestamp_to_childtheme_stylesheet() {
    wp_dequeue_style( 'style' );
    wp_deregister_style( 'style' );
    wp_enqueue_style('style', get_stylesheet_uri().'?'.filemtime(get_stylesheet_directory().'/style.css'), array(), null);
}
add_action( 'wp_print_styles', 'add_timestamp_to_childtheme_stylesheet' );

Credo che se utilizzi l'editor di temi di WordPress per modificare il foglio di stile del tuo child theme, aggiunga automaticamente un nuovo numero di versione ogni volta che salvi il file.