Come invalidare la cache del file style.css di un child theme

Question

Come invalidare la cache del file style.css di un child theme

2 gen 2016, 01:35:51

Visualizzazioni: 14.5K

Voti: 13

La mia domanda potrebbe avere diversi aspetti ma in sostanza è semplice: come ci si assicura che le modifiche apportate al file style.css di un child theme vengano propagate correttamente attraverso le cache?

Ho letto in diversi posti che WordPress dovrebbe/inserirebbe la versione di WP in nnn quando la risorsa viene recuperata come http://host/wp-content/themes/theme-child/style.css?ver=nnn. Nella mia installazione su http://frightanic.com/ vedo che invece viene utilizzata la versione del tema genitore. Ho W3 Total Cache e un CDN attivi ma anche se vengono disabilitati viene richiesta una risorsa come wp-content/themes/frightanic/style.css?ver=3.0.7. 3.0.7 è la versione del tema genitore Decode.

Ma comunque sia, se aggiorno il CSS del mio child theme senza aggiornare contemporaneamente WordPress o il tema genitore, come posso forzare l'invalidamento della cache?

Marcel Stör

361

child theme cache

Commenti

http://wordpress.stackexchange.com/a/147215/8105

montrealist

2 gen 2016 01:46:42

Tutte le risposte alla domanda

Commenti

Ottimo! Se hai risposto alla tua stessa domanda, va bene accettare la tua risposta come soluzione.

phatskat

4 gen 2016 17:21:52

Lo so, ma devi aspettare 2 giorni fino a quando quella funzione non sarà disponibile.

Marcel Stör

4 gen 2016 18:25:11

L'attuale manuale dei temi di WP ora contiene una correzione adeguata: https://developer.wordpress.org/themes/advanced-topics/child-themes/#3-enqueue-stylesheet

Marcel Stör

26 gen 2017 00:02:58

@MarcelStör Puoi descrivere esattamente dove nella pagina che hai linkato si menziona il 'cache busting', perché non l'ho trovato

Eric Hepperle - CodeSlayer2010

27 ago 2024 19:51:17

Funziona bene quando aggiungi direttamente nel tuo header.php e aggiorni la cache ogni volta che modifichi il file css:

<link rel="stylesheet" href="<?php bloginfo('stylesheet_url'); echo '?' . filemtime( get_stylesheet_directory() . '/style.css'); ?>" type="text/css" media="screen" />

Mostra: style.css?324932684 dove il numero rappresenta l'ora in cui il file è stato modificato

jcdarocha

11

30 set 2016 20:23:04

Commenti

Gli stili dovrebbero essere accodati utilizzando wp_enqueue_style invece di essere hardcoded.

bravokeyl

30 set 2016 20:29:52

Anche questo potrebbe funzionare. Utilizzando la funzione PHP rand:

function theme_enqueue_styles() {

    $parent_style = 'parent-style';

    wp_enqueue_style( $parent_style, get_template_directory_uri() . '/style.css' );
    wp_enqueue_style( 'child-style',
        get_stylesheet_directory_uri() . '/style.css?'.rand(),
        array( $parent_style )
    );
}
add_action( 'wp_enqueue_scripts', 'theme_enqueue_styles' );

Joshua Coolman

1

22 dic 2016 14:08:42

Commenti

Non è una buona idea perché vuoi che quei file siano memorizzabili nella cache del browser finché non vengono modificati.

Marcel Stör

22 dic 2016 17:44:27

WordPress ora gestisce questo con una funzione.

add_action( 'wp_enqueue_scripts', 'my_theme_enqueue_styles' );
function my_theme_enqueue_styles() {
    wp_enqueue_style( 'child-style', get_stylesheet_uri(),
        array( 'parenthandle' ), 
        wp_get_theme()->get('Version') // questo funziona solo se hai Version nell'intestazione dello stile
    );
}

Utilizza il Version: 1.0.0 nel tuo foglio di stile effettivo Inserisci foglio di stile con revisione

user1676224

196

24 ago 2020 13:12:42

Marcel Stör 361 · Accepted Answer · 2016-01-02T16:51:50Z

Il commento di @dalbaeb alla fine ha portato a discussioni approfondite e a una soluzione fattibile. Grazie mille!

Credo che il motivo per cui il CSS del mio child theme veniva caricato con 'ver=<parent-theme-version> fosse perché avevo seguito alla lettera il WP Codex sui child theme. Nel mio functions.php c'era questo codice:

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

Il codice che ho finito per usare è stato menzionato per la prima volta in https://wordpress.stackexchange.com/a/182023/30783 ma numerosi siti su Internet lo hanno copiato e incollato (senza dare il giusto credito).

// Assicurarsi che il child theme abbia una versione indipendente e possa invalidare le cache: https://wordpress.stackexchange.com/a/182023/30783
// Filtra get_stylesheet_uri() per restituire il foglio di stile del tema genitore
add_filter('stylesheet_uri', 'use_parent_theme_stylesheet');
// Carica gli script e gli stili di questo tema (dopo il tema genitore)
add_action('wp_enqueue_scripts', 'my_theme_styles', 20);

function use_parent_theme_stylesheet()
{
    // Usa il foglio di stile del tema genitore
    return get_template_directory_uri() . '/style.css';
}

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

    // Carica il nostro style.css con la nostra versione
    wp_enqueue_style('child-theme-style', get_stylesheet_directory_uri() . '/style.css',
        array(), $themeVersion);
}

Aggiornamento 2017-01-26

L'attuale manuale dei temi di WP ora contiene una soluzione corretta: https://developer.wordpress.org/themes/advanced-topics/child-themes/#3-enqueue-stylesheet