wp_enqueue_style pentru Plugin cu foi de stil multiple

Question

wp_enqueue_style pentru Plugin cu foi de stil multiple

3 mar. 2014, 20:26:22

Vizualizări: 37.2K

Voturi: 6

Dezvolt un plugin de navigare care adaugă animații la navigarea WordPress.

Am citit în Wordpress Codex că trebuie să folosesc wp_enqueue_style().

În primul rând, cum folosesc acest cod pentru fișiere CSS multiple în fișierul principal al plugin-ului meu?

Conform acestei întrebări, aș adăuga foile de stil astfel:

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

add_action('admin_print_styles', 'add_my_stylesheet');

Având în vedere că plugin-ul meu necesită încărcarea mai multor foi de stil, care dintre cele două variante de cod ar trebui să o folosesc?

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');

Sau

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');

Știu unde să adaug acest cod. Dar cum apelez foaia de stil pe care vreau să o folosesc?

De asemenea, pentru a clarifica ce ar face plugin-ul meu: Fișierul principal al plugin-ului ar încărca doar foaia de stil necesară. Iar pagina de opțiuni ar permite utilizatorului să selecteze care dintre foile de stil să fie necesară.

De exemplu, în format PHP aș folosi următoarele:

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

Variabila $name ar trebui să fie cea selectată din pagina de opțiuni, dar cum apelez foaia de stil necesară?

Sper că întrebarea mea este suficient de clară.

Uzair Hayat

163

wp enqueue style

Toate răspunsurile la întrebare

Folosește un if pentru a verifica dacă se conformează criteriilor tale, de exemplu:

o pagină/postare specifică (ID)
toate paginile/postările
legat de opțiunea de administrare.

În acest fel, va încărca doar CSS-ul dorit pe pagina specificată / când opțiunea dorită din administrare este selectată.

    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__ ) );
        }
    }

Sau:

    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' );

/** * Adaugă un fișier de stiluri pe pagină*/
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 ian. 2017 20:43:28

Comentarii

Te rog, mereu explică ce face codul. Pur și simplu trimite o [editare] și explică de ce codul tău rezolvă problema OP-ului.

kaiser

22 ian. 2017 21:14:52

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

Pentru a răspunde la prima întrebare, ai folosi al doilea stil, adică:

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');

Ceea ce face add_action() este să-i spună WordPress-ului: "Când acțiunea admin_print_styles are loc, rulează această funcție add_my_stylesheet()." În mod confuz, practica de a folosi acțiunile admin_print_styles și admin_enqueue_styles pentru a încărca fișierele de stil este incorectă - oricât de contraintuitiv ar părea, ar trebui să folosești admin_enqueue_scripts în loc.

Apelurile către wp_enqueue_style() adaugă apoi fișierele de stil specificate într-o listă de fișiere de stil care vor fi încărcate (dacă specifici argumentul de dependențe, atunci WordPress va avea grijă și ca fișierele tale de stil să se încarce în ordinea corectă). Nu este nevoie să "apelezi" un fișier de stil încărcat așa cum ai sugerat - dacă este încărcat, atunci va fi afișat într-un element HTML <link ...> în secțiunea <head></head> în același mod în care WordPress încarcă propriile sale fișiere de stil.

Pentru a selecta care fișier de stil va fi încărcat, pur și simplu adaugi logica ta în funcția add_my_stylesheet(); dacă nu dorești să folosești un anumit fișier de stil, atunci nu-l încarci, adică:

function admincolorplugin_enqueue_styles() 
{
    // Obține alegerea utilizatorului pentru fișierul de stil din opțiuni, implicit "white"
    $stylesheet = get_option( 'admincolorplugin_stylesheet', 'white' );

    // Încarcă condiționat fișierul de stil corespunzător
    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' );