Geekamongus - A Tech Blog for You

First, I don’t remember where I found this along the way, but this is a smart and efficient way to include jQuery in your WordPress themes. Just add this to your theme’s functions.php file:

// ADDING JQUERY
add_action( ‘init’, ‘jquery_register’ );
add_filter( ‘script_loader_src’, ‘jquery_unversion’ );

function jquery_register() {

if ( !is_admin() ) {
wp_deregister_script( ‘jquery’ );
wp_register_script( ‘jquery’, ( ‘http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js’ ), false, ’1.x’, false );
wp_enqueue_script( ‘jquery’ );
}
}

// remove version tag to improve cache compatibility
function jquery_unversion( $src ) {

if( strpos( $src, ‘ajax.googleapis.com’ ) )
$src = remove_query_arg( ‘ver’, $src );

return $src;
}

Now, the issue I have been having is that when I try to add your own jQuery scripts or functions in your theme’s header.php file, I always get this error:

“$ is not a function”

What?  Yes it is, dammit!

Turns out WordPress has reserved the $ character, so you have to rename all occurence of $ to ‘jQuery’.  Example:

Before

<script type=”text/javascript”>
$(document).ready(function() {
$(‘.slideshow’).cycle({
fx: ‘fade’,
timeout: 4000,
speed: 2000
});
});
</script>

After

<script type=”text/javascript”>
jQuery(document).ready(function() {
jQuery(‘.slideshow’).cycle({
fx: ‘fade’,
timeout: 4000,
speed: 2000
});
});
</script>

Hope that saves someone the hours of frustration I have had with this.