Perché il Foglio di Stile del Tema Figlio Non si Carica?

Question

Perché il Foglio di Stile del Tema Figlio Non si Carica?

23 gen 2017, 19:13:15

Visualizzazioni: 34.7K

Voti: 7

Sto utilizzando il tema HashOne e ho creato un tema figlio per apportare varie modifiche ai colori del nostro sito web.

Tuttavia, le modifiche che ho apportato al foglio di stile del tema figlio vengono applicate solo in alcune sezioni del sito, mentre altre modifiche vengono ereditate dal tema genitore. Ho creato un file functions.php che ritengo sia formattato correttamente. Ecco il codice:

<?php
// Aggiungi gli stili del tema
add_action( 'wp_enqueue_scripts', 'hashone_enqueue_styles' );
function hashone_enqueue_styles() {
wp_enqueue_style( 'hashone-parent-style', get_template_directory_uri() . 
'/style.css' );
}

Quando ho utilizzato la modalità di ispezione per vedere quale CSS stava sovrascrivendo il tema figlio, ho potuto confermare che è sicuramente il tema genitore. Tuttavia, ci sono tre file CSS che operano contemporaneamente e non ho idea di come risolvere questo problema.

stage.ottrial.pitt.edu/wp-content/themes/hashone/style.css?ver=4.7.1
stage.ottrial.pitt.edu/wp-content/themes/hashone-theme-child/style.css?ver=1.0
stage.ottrial.pitt.edu/wp-content/themes/hashone/style.css

Quello che ha la precedenza è il #3. Non sono sicuro di cosa sto facendo di sbagliato.

Sakena

73

child theme wp enqueue style css parent theme

Tutte le risposte alla domanda

Commenti

Puoi fornire un esempio di come sarebbe scritta la riga enqueue nel functions.php?

Sakena

23 gen 2017 22:19:00

Scusa se non sono stato chiaro. Quello che hai sopra è corretto. Ma lo stesso file viene caricato nuovamente in seguito (è il secondo file /hashone/style.css che vedi). Trova dove viene ricaricato e rimuovilo. Su un'installazione pulita di HashOne con un child theme composto solo da un file style.css vuoto e un file functions.php come hai sopra, gli stili vengono caricati correttamente nel mio caso.

Nathan Johnson

24 gen 2017 01:27:39

@NathanJohnson la tua soluzione è identica al codice dell'OP tranne che per la funzione anonima. Cosa c'è di diverso?

pcodex

2 nov 2018 03:12:49

Non è necessario caricare il foglio di stile del tuo Child Theme a meno che tu non voglia chiamarlo diversamente da style.css.

Di default, WordPress carica automaticamente il file style.css (nella directory principale del tema) sia del Parent Theme che del Child Theme.

Assicurati che il tuo Child Theme sia attivato e aggiungi il tuo CSS al file style.css del Child Theme.

Ricorda di utilizzare l'ispettore per identificare facilmente le regole CSS. Sovrascrivere le regole CSS del Parent Theme può a volte essere complicato. L'uso di !important può aiutare a sovrascrivere alcune delle regole CSS nel Parent Theme.

Esempio di utilizzo di !important in CSS

Supponiamo che il Parent Theme definisca questa regola:

#site-title {
    color: #000000;
    background: #ffffff;
}

Potresti sovrascrivere forzatamente questa regola nel tuo Child Theme in questo modo:

#site-title {
    color: #ffffff !important;
    background: #000000 !important;
}

Michael Ecklund

6.8K

23 gen 2017 19:26:55

Commenti

Grazie, Michael. Ho verificato che il mio child theme è attivato e che il mio CSS è stato aggiunto solo al child theme. Dove dovrei scrivere "!important" nel mio CSS per sovrascrivere il Parent Theme?

Sakena

23 gen 2017 19:40:08

Ho aggiornato la mia risposta con un esempio di utilizzo.

Michael Ecklund

23 gen 2017 19:45:55

Tieni presente il nuovo quartetto introdotto a partire da WP 4.7:

get_theme_file_uri()
get_parent_theme_file_uri()
get_theme_file_path()
get_parent_theme_file_path()

che è venuto a sostituire il vecchio quartetto:

get_stylesheet_directory_uri()
get_template_directory_uri()
get_stylesheet_directory()
get_template_directory()

Nell'ordine rispettivo. Il vantaggio è la migliore convenzione di denominazione.

prosti

4.31K

16 feb 2017 20:26:59

Nathan Johnson 6.53K · Accepted Answer · 2017-01-23T20:00:19Z

Non è necessario aggiungere altro codice nel tuo file functions.php per caricare il CSS del tema genitore dal tuo tema child. Il problema è che aggiungendo quel codice, stai caricando il CSS del tema genitore una seconda volta, ma ora viene caricato dopo quello del tema child. Questo significa che tutte le modifiche apportate nel tema child non avranno alcun effetto.

Basta rimuovere quella riga e dovresti vedere le modifiche nel tuo tema child.

Aggiunto: Ecco i due file che ho usato con solo l'essenziale per caricare correttamente il CSS del tema child.

File style.css:

/*
 * Nome Tema: HashOne Child
 * Template: hashone
 * Text Domain: hashone-chile
 */

File functions.php:

<?php
add_action( 'wp_enqueue_scripts', function() {
  wp_enqueue_style( 'hashone-parent-style', get_template_directory_uri() . '/style.css' );
});

Nathan Johnson

6.53K

23 gen 2017 20:00:19