The Importance of Enqueueing in WordPress

I’ve been working with WordPress on a strictly theme development basis for about 2 years now. I’ve edited and created countless CMS’s out of various WordPress themes and even authored 4 or so myself.

I’ve always stuck away from plugin development because I generally don’t like the concept of plugins.

Why the hell would I want to dirty up my clean website with someone else’s code that might be good, but might suck? Beyond that I do have some control over it, but not much and excessive plugin use (if poorly coded) totally slows down WordPress sites. Therefore I’ve always kept my plugin use on sites I manage to a minimum, Yoast for SEO, Akismet for spam, W3 Total Cache for speed etc.

I don’t mean this in a negative way. WordPress wouldn’t be nearly as popular or robust as it is without the amazing community of developers creating plugins and core updates, it just means I’m an overly cautious sometimes cynical developer.

All that to say, I’ve also been a bit nervous to develop plugins. The concepts, actions and hooks have always scared me a bit because I didn’t know them and I was comfortable with the theme development. Plugins are a whole new wrinkle.

But this weekend I be like, caution be damned…I’m doing this. So I started developing my very first plugin. It’s just a little writing prompt helper that I may or may not even release to the public, but it’s good to at least put yourself out there.

Anyway, I was working on this plugin over the weekend in our spaceship without any internet (not an easy task) and kept getting this error:

Notice: wp_register_script was called incorrectly. Scripts and styles should not be registered or enqueued until the wp_enqueue_scripts, admin_enqueue_scripts, or login_enqueue_scripts hooks.

Not to mention that, but nothing was working. I couldn’t get any stylesheets or scripts to enqueue for the life of me, which was seriously cramping my style!

I checked, double and triple checked my plugin code and for the life of me could not figure out why this was coming up. I was using add_action('admin_enqueue_scripts', 'my_function_name') to enqueue my scripts in the plugin so why in the world was this error coming up?

Well turns out I had been enqueueing improperly. I had been registering and enqueuing scripts using WordPress’s functions, but I was never hooking them properly. What I was doing was:

<?php 
 // Registered scripts...
 wp_register_script( 'jquery', '/wp-includes/js/jquery/jquery.js', '', '', true );
 wp_register_script( 'typer', get_template_directory_uri().'/js/jquery.typer.js', array('jquery'), '1.0', true );
 wp_register_script( 'global', get_template_directory_uri().'/js/global.js', array('jquery'), '1.0', true );
 // And then loaded them...
 wp_enqueue_script('jquery');
 wp_enqueue_script('typer'); ?>

And that was it. Little did I know that I also needed to wrap all of that in a function just like I did when I enqueued my scripts for my plugin. Therefore:

<?php 
function my_scripts() {
 // Registered scripts...
 wp_register_script( 'jquery', '/wp-includes/js/jquery/jquery.js', '', '', true );
 wp_register_script( 'typer', get_template_directory_uri().'/js/jquery.typer.js', array('jquery'), '1.0', true );
 wp_register_script( 'global', get_template_directory_uri().'/js/global.js', array('jquery'), '1.0', true );
 // And then loaded them...
 wp_enqueue_script('jquery');
 wp_enqueue_script('typer');
}
add_action('wp_enqueue_scripts', 'my_scripts');
?>

Fixed everything! Learn from my mistake…just enqueue properly and your life will be better and you’ll save ages of digging around for help.