Comment mettre le style en file d'attente avec wp_enqueue_style ()

Question

Comment mettre le style en file d'attente avec wp_enqueue_style ()

9

64813 2013-03-05

Je développe unthème. J'ai ajouté les codes (ci-dessous) dans le header.php. Maisje l'aiposté dans le référentiel dethèmes WP,et ilesten cours de révision,et le réviseurm'ainformé demettre le styleen file d'attente avec wp_enqueue_style()/wp_enqueue_script(). Maisje nepeuxpas comprendre comment l'implémenter avec lafonction. J'ai vu le wp_enqueue_style(); dans Codex,mais Jene comprendspas commentmettretout letas de codes avec leurs conditions.

 <style type="text/css">
<?php
// If the menu presents, then CSS loads

if ( has_nav_menu( 'secondary' ) ) {
?>
.sec-menu{
width: 100%;
background: #333;
height: 26px;
font-size:16px;
text-transform:uppercase;
}
<?php } ?>
<?php
if ( has_nav_menu( 'primary' ) ) {
?>
#access{
background-color: #333;
height: 26px;
}
<?php } ?>
<?php
if ( !has_nav_menu( 'primary' ) && !has_nav_menu( 'secondary' ) ) {
?>
.sec-menu,
#access{
border-bottom: 2px solid #333;
}
<?php } ?>
</style>

COMMENT?

I'm developing a theme. I added the codes (below) into the header.php. But I posted it into the WP theme repository, and it's under review, and the reviewer informed me to enqueue the style with wp_enqueue_style()/ wp_enqueue_script(). But can't understand how to implement it with the function. I've seen the directed wp_enqueue_style(); in Codex, but can't understand how to put the whole bunch of codes with their conditions.

<style type="text/css">
<?php
// If the menu presents, then CSS loads

if ( has_nav_menu( 'secondary' ) ) {
?>
.sec-menu{
width: 100%;
background: #333;
height: 26px;
font-size:16px;
text-transform:uppercase;
}
<?php } ?>
<?php
if ( has_nav_menu( 'primary' ) ) {
?>
#access{
background-color: #333;
height: 26px;
}
<?php } ?>
<?php
if ( !has_nav_menu( 'primary' ) && !has_nav_menu( 'secondary' ) ) {
?>
.sec-menu,
#access{
border-bottom: 2px solid #333;
}
<?php } ?>
</style>

HOW TO?

2 réponses

votes

1

2013-06-08

Ajout d'un deuxièmefichier style.csspour les archives depage de catégorie.

 add_action( 'wp_enqueue_scripts', 'wpsites_second_style_sheet' );
function wpsites_second_style_sheet() {
    if ( is_category() ) {
       wp_register_style( 'second-style', get_template_directory_uri() .'css/second-style.css', array(), '20130608');
       wp_enqueue_style( 'second-style' );    
    }    
}

Adding a second style.css file for category page archives.

add_action( 'wp_enqueue_scripts', 'wpsites_second_style_sheet' );
function wpsites_second_style_sheet() {
    if ( is_category() ) {
       wp_register_style( 'second-style', get_template_directory_uri() .'css/second-style.css', array(), '20130608');
       wp_enqueue_style( 'second-style' );    
    }    
}

Mike Madern · Accepted Answer · 2013-03-05

16

2013-03-05

Voici ce que vouspourriezfaire:

1 - Mettez le CSS dans unfichier séparéet enregistrez-le dans votre répertoire dethème.
2 - Ajoutez le code suivant dans vos functions php:

 function wpse_89494_enqueue_scripts() {
  if ( has_nav_menu( 'secondary' ) ) {
    wp_enqueue_style( 
      'wpse_89494_style_1', 
      get_template_directory_uri() . '/your-style_1.css' 
    );
  }
  if ( has_nav_menu( 'primary' ) ) {
    wp_enqueue_style( 
      'wpse_89494_style_2', 
      get_template_directory_uri() . '/your-style_2.css' 
    );
  }
  if ( ! has_nav_menu( 'primary' ) && ! has_nav_menu( 'secondary' ) ) {
    wp_enqueue_style( 
      'wpse_89494_style_3', 
      get_template_directory_uri() . '/your-style_3.css' 
    );
  }
}

add_action( 'wp_enqueue_scripts', 'wpse_89494_enqueue_scripts' );

This is what you could do:

1 - Put the CSS in a separate file and save it in your theme directory.
2 - Add the following code in your functions php:

function wpse_89494_enqueue_scripts() {
  if ( has_nav_menu( 'secondary' ) ) {
    wp_enqueue_style( 
      'wpse_89494_style_1', 
      get_template_directory_uri() . '/your-style_1.css' 
    );
  }
  if ( has_nav_menu( 'primary' ) ) {
    wp_enqueue_style( 
      'wpse_89494_style_2', 
      get_template_directory_uri() . '/your-style_2.css' 
    );
  }
  if ( ! has_nav_menu( 'primary' ) && ! has_nav_menu( 'secondary' ) ) {
    wp_enqueue_style( 
      'wpse_89494_style_3', 
      get_template_directory_uri() . '/your-style_3.css' 
    );
  }
}

add_action( 'wp_enqueue_scripts', 'wpse_89494_enqueue_scripts' );

Pourquoine pasmettre les conditions dans le callback `wp_enqueue_scripts`?Rien detout celan'abesoin d'aller dans latête du document.

Why not put the conditionals inside the `wp_enqueue_scripts` callback? None of that needs to go in the document head.
- 1
- 2013-03-05
- Chip Bennett
Jen'y aipaspensé,unmontageesten cours

I didn't think of that, a edit is on the way
- 1
- 2013-03-05
- Mike Madern
+1.J'aimodifiépour remplacer `get_bloginfo ('stylesheet_directory')`par `get_template_directory_uri ()`.Les références au répertoire ** stylesheet ** doivent être réservées auxthèmesenfants.

+1. I edited to replace `get_bloginfo( 'stylesheet_directory' )` with `get_template_directory_uri()`. References to **stylesheet** directory should be reserved for Child Themes.
- 0
- 2013-03-05
- Chip Bennett
Niceet bien.Celam'a résoluici.Merci Mike.J'ajouterai cefil dans [Codex] (http://codex.wordpress.org/Function_Reference/wp_enqueue_style),inshALLAH.Merci.

Nice & Fine. It solved me here. Thanks Mike. I'll add this thread into [Codex](http://codex.wordpress.org/Function_Reference/wp_enqueue_style), inshALLAH. Thanks.
- 0
- 2013-03-08
- Mayeenul Islam