¿Cómo cargar Widget javascript + css archivos solo si se usa?

12

Me gustaría mantener los estilos javascript y css utilizados por mi widget dentro de sus propios archivos (y no agregarlos al tema).

Pero parece que no puedo hacer que Wordpress los agregue cuando el widget se usa realmente en una barra lateral.

He intentado esto:

dentro de la declaración de clase, he añadido 2 funciones

class EssentielleRubriquesPosts extends WP_Widget {

function addFrontendCss(){
    wp_enqueue_style('erw-frontend-css', ESSENTIELLE_RUBRIQUE_WIDGET_PLUGIN_PATH . 'css/EssentielleRubriqueWidget-frontend.css');
}
function addFrontendJavascript(){
    wp_register_script('jq-hoverintent', PLUGIN_PATH . 'js/jquery.hoverintent.js', array('jquery'), '1.0',true);
    wp_enqueue_script('jq-hoverintent');
    wp_enqueue_script('jq-tools', PLUGIN_PATH . 'js/jquery.tools.js', array('jquery'),'1.0',true);
    wp_enqueue_script('erw-frontend-js', PLUGIN_PATH . 'js/widget-frontend.js', array('jquery', 'jq-hoverintent', 'jq-tools'),'1.0',true);

}

y dentro de la función widget ():

function widget($args, $instance) {
        add_action( 'wp_print_scripts', 'addFrontendJavascript' );
        add_action( 'wp_print_styles', 'addFrontendCss' );
}

Pero eso no hace nada ...

    
pregunta pixeline 03.10.2011 - 15:54

2 respuestas

6

wp_print_scripts y wp_print_styles ganchos se activan mucho antes de su función de widget, por lo que es así que no está funcionando.

Una solución para eso sería incluir los scripts en el pie de página usando wp_print_footer_scripts hook, eche un vistazo a La respuesta de Jan a una pregunta similar

O una solución mucho mejor, eche un vistazo a la respuesta de Sorich a otra pregunta similar

    
respondido por el Bainternet 03.10.2011 - 16:27
4

La mejor solución es registrar sus activos primero y luego poner en cola el CSS y JS dentro de la función widget() de su WP_Widget (encolar directamente, no agregando nuevos ganchos).

He probado esta solución y funciona en la versión actual de WordPress (4.5.3); tanto el JS como el CSS se agregan en el pie de página.

<?php
// Register your assets during 'wp_enqueue_scripts' hook.
function custom_register_scripts() {
    wp_register_style('erw-frontend-css', '...frontend.css');
    wp_register_script('jq-hoverintent', '...hoverintent.js', ...);
    wp_register_script('jq-tools', '...tools.js', ...);
}
// Use wp_enqueue_scripts hook
add_action('wp_enqueue_scripts', 'custom_register_scripts');


class YourWidget extends WP_Widget {
    public function __construct() {
    }

    public function widget( $args, $instance ) {
        // Enqueue needed assets inside the 'widget' function.
        wp_enqueue_style('erw-frontend-css');
        wp_enqueue_script('jq-hoverintent');
        wp_enqueue_script('jq-tools');

        // Output widget contents.
    }

    public function form( $instance ) {
    }

    public function update( $new_instance, $old_instance ) {
    }
}
    
respondido por el Philipp 04.08.2016 - 13:55

Lea otras preguntas en las etiquetas