Cómo poner en cola el estilo usando wp_enqueue_style ()

9

Estoy desarrollando un tema. Agregué los códigos (abajo) en el header.php. Pero lo publiqué en el repositorio de temas de WP, y está bajo revisión, y el revisor me informó que agregue el estilo con wp_enqueue_style()/ wp_enqueue_script(). Pero no puedo entender cómo implementarlo con la función. He visto lo dirigido wp_enqueue_style();en Codex, pero no puedo entender cómo poner todo el conjunto de códigos con sus condiciones.

<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>
  • ¿CÓMO?
wp-enqueue-style Mayeenul Islam
fuente

Respuestas:

16

Esto es lo que puedes hacer:

1 - Coloque el CSS en un archivo separado y guárdelo en su directorio de temas.
2 - Agregue el siguiente código en su 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' );
Mike Madern
fuente
1
¿Por qué no poner los condicionales dentro de la wp_enqueue_scriptsdevolución de llamada? Nada de eso debe ir en el encabezado del documento.
Chip Bennett
1
No pensé en eso, una edición está en camino
Mike Madern
+1. Edité para reemplazar get_bloginfo( 'stylesheet_directory' )con get_template_directory_uri(). Las referencias al directorio de la hoja de estilo deben reservarse para Temas secundarios.
Chip Bennett
Agradable y bien. Me resolvió aquí. Gracias Mike Agregaré este hilo en el Codex , inshALLAH. Gracias.
Mayeenul Islam
1

Agregar un segundo style.cssarchivo para archivos de página de categoría.

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' );    
    }    
}
Brad Dalton
fuente