I’d like to keep the javascript and css styles used by my widget inside their own files (and not add them to the theme).
But i can’t seem to get wordpress to add them when the widget is actually used on a sidebar.
I’ve tried this:
inside the Class declaration, i’ve added 2 functions
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);
}
and inside the widget() function:
function widget($args, $instance) {
add_action( 'wp_print_scripts', 'addFrontendJavascript' );
add_action( 'wp_print_styles', 'addFrontendCss' );
}
But that doesn’t do anything…
wp_print_scripts
and wp_print_styles
hooks are fired way before your widget function so that is way it’s not working.
A solution to that would be to include the scripts in the footer using wp_print_footer_scripts
hook, take a look at Jan’s answer to a similar question
Or a much nicer solution take a look at Sorich’s answer to another similar question