wp_enqueue_style per Plugin con più fogli di stile

Question

wp_enqueue_style per Plugin con più fogli di stile

3 mar 2014, 20:26:22

Visualizzazioni: 37.2K

Voti: 6

Sto creando un plugin di navigazione che aggiunge animazioni alla navigazione di WordPress.

Ho letto nel Wordpress Codex che dovrei utilizzare wp_enqueue_style().

Prima di tutto, come posso utilizzare questo codice per file CSS multipli nel mio file principale del plugin?

Secondo questa domanda, dovrei aggiungere i fogli di stile in questo modo:

function add_my_stylesheet() 
{
    wp_enqueue_style( 'myCSS', plugins_url( '/css/myCSS.css', __FILE__ ) );
}

add_action('admin_print_styles', 'add_my_stylesheet');

Dal momento che il mio plugin richiede l'aggiunta di più fogli di stile, quale dei due codici dovrei utilizzare?

function add_my_stylesheet() 
{
    wp_enqueue_style( 'myCSS', plugins_url( '/css/myCSS.css', __FILE__ ) );
}

add_action('admin_print_styles', 'add_my_stylesheet');

function add_my_stylesheet1() 
{
    wp_enqueue_style( 'myCSS1', plugins_url( '/css/myCSS1.css', __FILE__ ) );
}

add_action('admin_print_styles', 'add_my_stylesheet1');

Oppure

function add_my_stylesheet1() 
{
    wp_enqueue_style( 'myCSS1', plugins_url( '/css/myCSS.css', __FILE__ ) );
    wp_enqueue_style( 'myCSS1', plugins_url( '/css/myCSS1.css', __FILE__ ) );
}

add_action('admin_print_styles', 'add_my_stylesheet1');

Ora so dove aggiungere questo codice. Ma come faccio a richiamare il foglio di stile che voglio utilizzare?

Inoltre, per chiarire cosa farebbe il mio plugin: Il file principale del plugin caricherà solo il foglio di stile necessario. E la pagina delle opzioni permetterà all'utente di selezionare quale foglio di stile richiedere.

Per esempio, in formato php userei il seguente:

<link href="nav-<?php echo $name; ?>.css">

Il $name dovrebbe essere quello selezionato dalla pagina delle opzioni, ma come faccio a richiamare il foglio di stile richiesto?

Spero che la mia domanda sia abbastanza chiara.

Uzair Hayat

163

wp enqueue style

Tutte le risposte alla domanda

Utilizza un if per verificare se soddisfa i tuoi criteri, ad esempio:

una pagina/articolo specifico (id)
tutte le pagine/articoli
relativo all'opzione di amministrazione.

In questo modo caricherà solo il CSS che desideri nella pagina desiderata / quando è selezionata l'opzione di amministrazione desiderata.

    function add_my_stylesheet1() 
    {
        if(is_page(41)){
            wp_enqueue_style( 'myCSS1', plugins_url( '/css/myCSS.css', __FILE__ ) );
        }else{
            wp_enqueue_style( 'myCSS1', plugins_url( '/css/myCSS1.css', __FILE__ ) );
        }
    }

Oppure:

    function add_my_stylesheet1() 
    {
        $adminopt = get_option( $option, $default );
        if($adminopt == "Normal CSS"){
            wp_enqueue_style( 'myCSS', plugins_url( '/css/myCSS.css', __FILE__ ) );
        }else{
            wp_enqueue_style( 'myCSS1', plugins_url( '/css/myCSS1.css', __FILE__ ) );
        }
    }

ScottMcGready

101

3 mar 2014 20:54:01

add_action( 'admin_enqueue_scripts', 'safely_add_stylesheet_to_admin' );

/** * Aggiunge il foglio di stile alla pagina*/
function safely_add_stylesheet_to_admin() {
    wp_enqueue_style( 'prefix-style', plugins_url('plugin_styles.css', __FILE__) );
    wp_enqueue_style( 'prefix-basic', plugins_url('/css/basic.css', __FILE__) );

}

vishakha

1

22 gen 2017 20:43:28

Commenti

Per favore, sempre spiega cosa fa il codice. Inserisci semplicemente una [modifica] e spiega perché il tuo codice risolve il problema dell'OP.

kaiser

22 gen 2017 21:14:52

bosco 6.98K · Accepted Answer · 2014-03-03T22:39:10Z

Per rispondere alla tua prima domanda, dovresti usare il secondo stile, ovvero:

function add_my_stylesheet() 
{
    wp_enqueue_style( 'myCSS', plugins_url( '/css/myCSS.css', __FILE__ ) );
    wp_enqueue_style( 'myCSS1', plugins_url( '/css/myCSS1.css', __FILE__ ) );
}

add_action('admin_print_styles', 'add_my_stylesheet');

Ciò che la funzione add_action() fa è dire a WordPress: "Quando l'azione admin_print_styles si verifica, esegui questa funzione add_my_stylesheet()". In modo confuso, la pratica di utilizzare le azioni admin_print_styles e admin_enqueue_styles per accodare i fogli di stile è errata - per quanto controintuitivo possa sembrare, dovresti invece usare admin_enqueue_scripts.

Le chiamate a wp_enqueue_style() aggiungono poi i fogli di stile specificati a un elenco di fogli di stile che verranno caricati (se specifichi l'argomento delle dipendenze, WordPress si assicurerà anche che i tuoi fogli di stile vengano caricati nell'ordine corretto). Non hai bisogno di "chiamare" un foglio di stile accodato come hai suggerito - se è accodato, allora verrà stampato in un elemento HTML <link ...> nella sezione <head></head> nello stesso modo in cui WordPress carica i propri fogli di stile.

Per selezionare quale foglio di stile verrà caricato, aggiungi semplicemente la tua logica alla funzione add_my_stylesheet(); se non desideri che un foglio di stile venga utilizzato, allora non lo accodi, ad esempio:

function admincolorplugin_enqueue_styles() 
{
    // Ottieni la scelta del foglio di stile dell'utente dalle opzioni, di default "white"
    $stylesheet = get_option( 'admincolorplugin_stylesheet', 'white' );

    // Carica condizionalmente il foglio di stile appropriato
    if( $stylesheet == 'black' ) {
        wp_enqueue_style( 'admincolorplugin-black', plugins_url( '/css/black.css', __FILE__ ) );
    }
    else {
        wp_enqueue_style( 'admincolorplugin-white', plugins_url( '/css/white.css', __FILE__ ) );
    }
}

add_action('admin_enqueue_scripts', 'admincolorplugin_enqueue_styles' );