wp_enqueue_style pour un plugin avec plusieurs feuilles de style

4

Je crée un plugin de navigation qui ajoute des animations à votre navigation wordpress.

J'ai lu dans Wordpress Codex que je devrais utiliser wp_enqueue_style ().

Premièrement, comment utiliser ce code pour plusieurs fichiers CSS? dans mon fichier de plugin principal.

Maintenant, selon cette question , j'ajouterais feuilles de style comme ceci:

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

add_action('admin_print_styles', 'add_my_stylesheet');

Étant donné que mon plugin nécessite l'ajout de plusieurs feuilles de style, lequel des deux codes dois-je utiliser?

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

Ou

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

Maintenant, je sais où ajouter ce code. Mais comment appeler la feuille de style que je veux utiliser?

Aussi, pour clarifier ce que ma fiche ferait: Le fichier de plugin principal ne chargerait que la feuille de style requise. Et la page des options permettrait à l’utilisateur de sélectionner la feuille de style à utiliser.

Par exemple, au format PHP, je voudrais utiliser ce qui suit:

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

Le nom $ devrait être celui sélectionné dans la page des options, mais comment puis-je appeler dans la feuille de style requise?

J'espère que ma question est suffisamment claire.

    
posée Uzair Hayat 03.03.2014 - 19:26

3 réponses

5

Pour répondre à votre première question, vous utiliseriez le second style, à savoir.

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

Ce que add_action() function fait, c'est dire à WordPress, "When l'action admin_print_styles se produit, exécutez cette fonction add_my_stylesheet() ." De manière confuse, la pratique consistant à utiliser les actions admin_print_styles et admin_enqueue_styles pour mettre en file d'attente les feuilles de style est incorrecte - aussi contre-intuitif soit-il d'utiliser admin_enqueue_scripts à la place.

Les appels à wp_enqueue_style() ajouteront les feuilles de style spécifiées à une liste de feuilles de style à charger (si vous spécifiez l’argument des dépendances, WordPress veillera également à ce que vos feuilles de style se chargent dans le bon ordre). Vous n'avez pas besoin "d'appeler" une feuille de style mise en file d'attente comme vous l'avez suggéré. Si elle est mise en file d'attente, elle sera imprimée dans un élément HTML <link ...> dans la section <head></head> du même élément. manière à ce que WordPress charge ses propres feuilles de style.

Afin de sélectionner la feuille de style à charger, vous ajoutez simplement votre logique à votre fonction add_my_stylesheet() ; si vous ne souhaitez pas utiliser une feuille de style, vous ne la mettez pas en file d'attente, c'est-à-dire:

.
function admincolorplugin_enqueue_styles() 
{
    // Get the user's stylesheet choice from the options, default to "white"
    $stylesheet = get_option( 'admincolorplugin_stylesheet', 'white' );

    // Conditionally load the appropriate stylesheet
    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' );
    
réponse donnée bosco 03.03.2014 - 21:39
0

Utilisez un if pour vérifier s'il est conforme à vos critères, par exemple

.
  1. une page / un message spécifique (id)
  2. toutes les pages / publication
  3. lié à l'option admin.

De cette manière, le CSS que vous souhaitez afficher sur la page souhaitée / ne sera extrait que lorsque l'option d'administration souhaitée est sélectionnée.

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

Ou:

    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__ ) );
        }
    }
    
réponse donnée ScottMcGready 03.03.2014 - 19:54
0
add_action( 'admin_enqueue_scripts', 'safely_add_stylesheet_to_admin' );

/** * Add stylesheet to the page*/
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__) );

}
    
réponse donnée vishakha 22.01.2017 - 19:43

Lire d'autres questions sur les étiquettes