Come registrare/enqueue un file CSS personalizzato?
Buongiorno.
Sto utilizzando un tema WordPress e vorrei aggiungere il mio CSS personalizzato. Ho provato ad aggiungere il mio foglio di stile separato dopo tutte le altre chiamate ai fogli di stile PHP nel file header.php. Ho anche provato a modificare il foglio di stile in Aspetto>Editor, e ho persino aggiunto !important a TUTTI i miei stili. Ma WordPress continua a sovrascrivere i miei stili con il foglio di stile predefinito.
Ho letto qualcosa sul registrare/caricare i fogli di stile nel functions.wp-styles.php ma il codice lì è arabo per me... Non so dove aggiungere il mio css...
Ecco il codice nella pagina functions.wp-styles.php: Il vostro aiuto sarà molto apprezzato!
<?php
/**
* API procedurali per gli stili di BackPress.
*
* @package BackPress
* @since r79
*/
/**
* Visualizza gli stili nella coda o parte di $handles.
*
* @since r79
* @uses do_action() Chiama l'hook 'wp_print_styles'.
* @global object $wp_styles L'oggetto WP_Styles per la stampa degli stili.
*
* @param array|bool $handles Stili da stampare. Un array vuoto stampa la coda,
* un array con una stringa stampa quello stile, e un array di stringhe stampa quegli stili.
* @return bool True in caso di successo, false in caso di fallimento.
*/
function wp_print_styles( $handles = false ) {
if ( '' === $handles ) // per wp_head
$handles = false;
if ( ! $handles )
do_action( 'wp_print_styles' );
global $wp_styles;
if ( ! is_a( $wp_styles, 'WP_Styles' ) ) {
if ( ! did_action( 'init' ) )
_doing_it_wrong( __FUNCTION__, sprintf( __( 'Script e stili non dovrebbero essere registrati o accodati fino agli hook %1$s, %2$s, o %3$s.' ),
'<code>wp_enqueue_scripts</code>', '<code>admin_enqueue_scripts</code>', '<code>init</code>' ), '3.3' );
if ( !$handles )
return array(); // Non c'è bisogno di istanziare se non c'è niente.
else
$wp_styles = new WP_Styles();
}
return $wp_styles->do_items( $handles );
}
/**
* Aggiunge CSS extra.
*
* Funziona solo se il foglio di stile è già stato aggiunto.
* Accetta una stringa $data contenente il CSS. Se due o più blocchi di codice CSS sono
* aggiunti allo stesso foglio di stile $handle, verranno stampati nell'ordine
* in cui sono stati aggiunti, cioè gli stili aggiunti dopo possono ridefinire i precedenti.
*
* @since 3.3.0
* @see WP_Scripts::add_inline_style()
*/
function wp_add_inline_style( $handle, $data ) {
global $wp_styles;
if ( ! is_a( $wp_styles, 'WP_Styles' ) ) {
if ( ! did_action( 'init' ) )
_doing_it_wrong( __FUNCTION__, sprintf( __( 'Script e stili non dovrebbero essere registrati o accodati fino agli hook %1$s, %2$s, o %3$s.' ),
'<code>wp_enqueue_scripts</code>', '<code>admin_enqueue_scripts</code>', '<code>init</code>' ), '3.3' );
$wp_styles = new WP_Styles();
}
return $wp_styles->add_inline_style( $handle, $data );
}
/**
* Registra un file CSS.
*
* @since r79
* @see WP_Styles::add() Per informazioni aggiuntive.
* @global object $wp_styles L'oggetto WP_Styles per la stampa degli stili.
* @link http://www.w3.org/TR/CSS2/media.html#media-types Lista dei tipi di media CSS.
*
* @param string $handle Nome del foglio di stile.
* @param string|bool $src Percorso al foglio di stile dalla directory root di WordPress. Esempio: '/css/mystyle.css'.
* @param array $deps Array di handle di qualsiasi foglio di stile da cui dipende questo foglio di stile.
* (Fogli di stile che devono essere caricati prima di questo foglio di stile.) Passa un array vuoto se non ci sono dipendenze.
* @param string|bool $ver Stringa che specifica il numero di versione del foglio di stile. Imposta a null per disabilitare.
* Usato per assicurare che la versione corretta sia inviata al client indipendentemente dalla cache.
* @param string $media Il media per cui questo foglio di stile è stato definito.
*/
function wp_register_style( $handle, $src, $deps = array(), $ver = false, $media = 'all' ) {
global $wp_styles;
if ( ! is_a( $wp_styles, 'WP_Styles' ) ) {
if ( ! did_action( 'init' ) )
_doing_it_wrong( __FUNCTION__, sprintf( __( 'Script e stili non dovrebbero essere registrati o accodati fino agli hook %1$s, %2$s, o %3$s.' ),
'<code>wp_enqueue_scripts</code>', '<code>admin_enqueue_scripts</code>', '<code>init</code>' ), '3.3' );
$wp_styles = new WP_Styles();
}
$wp_styles->add( $handle, $src, $deps, $ver, $media );
}
/**
* Rimuove un file CSS registrato.
*
* @since r79
* @see WP_Styles::remove() Per informazioni aggiuntive.
* @global object $wp_styles L'oggetto WP_Styles per la stampa degli stili.
*
* @param string $handle Nome del foglio di stile.
*/
function wp_deregister_style( $handle ) {
global $wp_styles;
if ( ! is_a( $wp_styles, 'WP_Styles' ) ) {
if ( ! did_action( 'init' ) )
_doing_it_wrong( __FUNCTION__, sprintf( __( 'Script e stili non dovrebbero essere registrati o accodati fino agli hook %1$s, %2$s, o %3$s.' ),
'<code>wp_enqueue_scripts</code>', '<code>admin_enqueue_scripts</code>', '<code>init</code>' ), '3.3' );
$wp_styles = new WP_Styles();
}
$wp_styles->remove( $handle );
}
/**
* Accoda un file CSS.
*
* Registra lo stile se viene fornito src (NON sovrascrive) e lo accoda.
*
* @since r79
* @see WP_Styles::add(), WP_Styles::enqueue()
* @global object $wp_styles L'oggetto WP_Styles per la stampa degli stili.
* @link http://www.w3.org/TR/CSS2/media.html#media-types Lista dei tipi di media CSS.
*
* @param string $handle Nome del foglio di stile.
* @param string|bool $src Percorso al foglio di stile dalla directory root di WordPress. Esempio: '/css/mystyle.css'.
* @param array $deps Array di handle (nomi) di qualsiasi foglio di stile da cui dipende questo foglio di stile.
* (Fogli di stile che devono essere caricati prima di questo foglio di stile.) Passa un array vuoto se non ci sono dipendenze.
* @param string|bool $ver Stringa che specifica il numero di versione del foglio di stile, se ne ha uno. Questo parametro
* è usato per assicurare che la versione corretta sia inviata al client indipendentemente dalla cache, e quindi dovrebbe essere incluso
* se un numero di versione è disponibile e ha senso per il foglio di stile.
* @param string $media Il media per cui questo foglio di stile è stato definito.
*/
function wp_enqueue_style( $handle, $src = false, $deps = array(), $ver = false, $media = 'all' ) {
global $wp_styles;
if ( ! is_a( $wp_styles, 'WP_Styles' ) ) {
if ( ! did_action( 'init' ) )
_doing_it_wrong( __FUNCTION__, sprintf( __( 'Script e stili non dovrebbero essere registrati o accodati fino agli hook %1$s, %2$s, o %3$s.' ),
'<code>wp_enqueue_scripts</code>', '<code>admin_enqueue_scripts</code>', '<code>init</code>' ), '3.3' );
$wp_styles = new WP_Styles();
}
if ( $src ) {
$_handle = explode('?', $handle);
$wp_styles->add( $_handle[0], $src, $deps, $ver, $media );
}
$wp_styles->enqueue( $handle );
}
/**
* Rimuove uno stile accodato.
*
* @since WP 3.1
* @see WP_Styles::dequeue() Per informazioni sui parametri.
*/
function wp_dequeue_style( $handle ) {
global $wp_styles;
if ( ! is_a( $wp_styles, 'WP_Styles' ) ) {
if ( ! did_action( 'init' ) )
_doing_it_wrong( __FUNCTION__, sprintf( __( 'Script e stili non dovrebbero essere registrati o accodati fino agli hook %1$s, %2$s, o %3$s.' ),
'<code>wp_enqueue_scripts</code>', '<code>admin_enqueue_scripts</code>', '<code>init</code>' ), '3.3' );
$wp_styles = new WP_Styles();
}
$wp_styles->dequeue( $handle );
}
/**
* Controlla se uno stile è stato aggiunto agli Stili di WordPress.
*
* Di default, controlla se lo stile è stato accodato. Puoi anche
* passare 'registered' a $list, per vedere se lo stile è registrato,
* e puoi controllare gli stati di elaborazione con 'to_do' e 'done'.
*
* @since WP sconosciuto; BP sconosciuto
* @global object $wp_styles L'oggetto WP_Styles per la stampa degli stili.
*
* @param string $handle Nome del foglio di stile.
* @param string $list Opzionale. Default 'enqueued'. Valori sono
* 'registered', 'enqueued' (o 'queue'), 'to_do', e 'done'.
* @return bool Se lo stile è nella lista.
*/
function wp_style_is( $handle, $list = 'enqueued' ) {
global $wp_styles;
if ( ! is_a( $wp_styles, 'WP_Styles' ) ) {
if ( ! did_action( 'init' ) )
_doing_it_wrong( __FUNCTION__, sprintf( __( 'Script e stili non dovrebbero essere registrati o accodati fino agli hook %1$s, %2$s, o %3$s.' ),
'<code>wp_enqueue_scripts</code>', '<code>admin_enqueue_scripts</code>', '<code>init</code>' ), '3.3' );
$wp_styles = new WP_Styles();
}
return (bool) $wp_styles->query( $handle, $list );
}

Fai riferimento alla voce del Codex per wp_enqueue_style()
.
Supponendo che tu abbia un foglio di stile personalizzato, chiamato custom.css
, situato nella directory principale del tuo tema:
wp_enqueue_style( 'mytheme-custom', get_template_directory_uri() . '/custom.css' );
Dovresti inserire questo codice in functions.php
, all'interno di una callback, agganciata a un'azione appropriata, come segue:
function wpse87681_enqueue_custom_stylesheets() {
if ( ! is_admin() ) {
wp_enqueue_style( 'mytheme-custom', get_template_directory_uri() . '/custom.css' );
}
}
add_action( 'wp_enqueue_scripts', 'wpse87681_enqueue_custom_stylesheets', 11 );
Puoi giocare con l'hook (puoi usare anche wp_head
come punto più tardivo) o con la priorità (il valore predefinito è 10
) per assicurarti che il tuo foglio di stile personalizzato venga caricato dopo qualsiasi altro foglio di stile che desideri sovrascrivere. Ma se stai cercando di sovrascrivere il foglio di stile predefinito, qualsiasi hook appropriato e qualsiasi priorità dovrebbero andare bene, perché il collegamento al foglio di stile predefinito è normalmente hard-codato nell'intestazione del documento in header.php
.
