¿Cómo cargar condicionalmente una hoja de estilos solo para ciertas páginas?

16 ene 2012, 22:45:19
Vistas: 22.1K
Votos: 11

Antes de empezar, quiero reconocer que hay algunos artículos muy buenos dirigidos a cómo cargar scripts condicionalmente basados en el contenido de páginas/entradas.

Estos son excelentes, pero son mucho más avanzados de lo que quiero hacer.

Siento que la respuesta está en usar la función incorporada is_page() (codex), pero cuando intento usarla el sitio se rompe o simplemente no funciona.

Creo que solo estoy ejecutando la lógica condicional en el lugar equivocado.

Esto es lo que he intentado agregar a mi functions.php:

function wpse39130_register_more_stylesheets() {
    wp_register_style( 'stylesheet_name', get_stylesheet_directory_uri() . '/stylesheet.css' );
}
add_action( 'init', 'wpse39130_register_more_stylesheets' );

function wpse39130_conditionally_enqueue_my_stylesheet() {
    // solo cargar en la página con slug products-services
    if ( is_page( 'products-services' ) ) {
        wp_enqueue_style( 'stylesheet_name' );
    }
}
add_action( 'wp_enqueue_scripts', 'wpse39130_conditionally_enqueue_my_stylesheet' );

Cuando elimino la parte condicional, la hoja de estilos se carga correctamente, así que sé que eso funciona.

1
Comentarios

De hecho, también usé copiar y pegar tu código y funciona perfectamentetexto en negrita

abhishek abhi Abhi abhishek abhi Abhi
13 feb 2017 11:04:16
Todas las respuestas a la pregunta 3
1

Copié y pegué tu código en mi entorno de desarrollo, no cambié nada excepto el nombre de la página, y funciona perfectamente. ¿Estás seguro de que no se está encolando y simplemente lo tienes apuntado mal o que el nombre de la página no está incorrecto o algo así?

16 ene 2012 22:52:00
Comentarios

¡Gracias, sí funciona! No sé por qué no funcionaba antes. Cosas más raras han pasado, supongo. Espero que esto le sea útil a alguien más.

Evan Mattson Evan Mattson
17 ene 2012 02:19:42
0

Lo que tienes es correcto, solo que lo estás enganchando a la acción equivocada. Prueba con la acción "wp" en lugar de "init". Cuando init se ejecuta, is_page() aún no funcionará correctamente.

EDITADO: Estaba equivocado. Pensé que tenías add_my_stylesheet enganchado a init, pero no lo tienes. is_page debería funcionar desde la acción enqueue_scripts. Disculpa... continúa...

16 ene 2012 22:53:39
1

Estaba intentando seguir el mismo código para ver si obtenía el mismo resultado, y noté que is_page() no funciona como esperaba. Así que seguí la variable global $post y verifiqué el nombre/slug de la categoría, luego utilicé una comparación de texto simple para decidir la acción.

    global $post;
    $postcat = get_the_category( $post->ID );
if ( ! empty( $postcat ) ) {
 echo esc_html( $postcat[0]->ID );   // Depuración 
 echo esc_html( $postcat[1]->name ); // Depuración 
 echo var_dump($postcat ); // Depuración 
}

El valor de la categoría si es solo una categoría (no una subcategoría) sería:

echo esc_html( $postcat[0]->name ); //Muestra el nombre en pantalla

Para una subcategoría, tendrás la siguiente variable llena:

echo esc_html( $postcat[1]->name ); //Muestra el nombre en pantalla

Ahora, basado en tu necesidad, usa el código de abajo, como yo lo uso para verificar el nombre de la subcategoría:

//Usa $postcat[0]->name para el nombre de la categoría padre Puede ser el nombre de tu subcategoría 
        if ( $postcat[1]->name == 'Shopping' ) { 

                wp_enqueue_style( 'stylesheet_name' );
            }else{
        // otro código 
        }

Código completo:

        function wpse39130_register_more_stylesheets() {
        wp_register_style( 'stylesheet_name', get_stylesheet_directory_uri() . '/whatsqshop.css' );
    }
    add_action( 'init', 'wpse39130_register_more_stylesheets' );

    function wpse39130_conditionally_enqueue_my_stylesheet() {
        // solo cargar en la página con slug product-services
    global $post; //Variable global Post 
    $postcat = get_the_category( $post->ID ); // Obtener la información de la categoría desde el ID del POST

    if ( ! empty( $postcat ) ) { // SI LA CATEGORÍA DEL POST NO ESTÁ VACÍA
    //    echo esc_html( $postcat[0]->slug );   //Muestra el SLUG en la pantalla <Opción de depuración>
  //echo esc_html( $postcat[0]->name ); //Muestra el nombre en pantalla
     //echo esc_html( $postcat[1]->name ); //Muestra el nombre en pantalla

    //echo var_dump($postcat ); // Para depuración 
    }
    //  if( is_single(88)) {
       if ( $postcat[1]->name == 'Shopping' ) {
            wp_enqueue_style( 'stylesheet_name' );
        }else{
    //wp_enqueue_style( 'stylesheet_name' );
    }

    }
    add_action( 'wp_enqueue_scripts', 'wpse39130_conditionally_enqueue_my_stylesheet' );

Ejemplo: *Sin CSS extra http://whatsq.com/category/gst16/

*CSS extra con fondo solo para la categoría anterior http://whatsq.com/information-technology/shopping-information-technology/mothers-day-gift-plan-show-mom-the-love-with-flowers-and-and-more/

7 may 2018 09:53:51
Comentarios

¿Acaso hice una pregunta? Solo es mi respuesta al tema actual. La cual es más detallada.

Piclaunch S Piclaunch S
8 may 2018 00:06:49