I am using the following script to call my Jquery and Jquery UI as well as a custom-script.js. Currently it works to the point of being able to see the resource in the inspector and the tag's are outputted. However the code I use on the page like .datepicker just doesn't work. However If I use a hacked script tag and include my own jquery files my code works and .datepickers works. You can view the site at http://fiftyfity.com/place-an-order/ this is the version with the wp_enqueue_script running. I am stuck I want to use enqueue but it breaks my site.


function wptuts_scripts_basic() 
    // Register the script like this for a plugin:
    //wp_register_script( 'custom-script', plugins_url( '/js/custom-script.js', __FILE__ ) );
    // or
    // Register the script like this for a theme:
    wp_register_script( 'custom-script', get_template_directory_uri() . '/js/custom-script.js', array('jquery','jquery-ui-core') );

    // For either a plugin or a theme, you can then enqueue the script:
    wp_enqueue_script( 'custom-script' );
add_action( 'wp_enqueue_scripts', 'wptuts_scripts_basic' );

Ouputted Html

<script type='text/javascript' src='http://fiftyfity.com/wp-includes/js/jquery/jquery.js?ver=1.7.1'></script>
<script type='text/javascript' src='http://fiftyfity.com/wp-includes/js/jquery/ui/jquery.ui.core.min.js?ver=1.8.16'></script>

My hacked script tag *this works If I comment out the wp_enqueue_script

$url = content_url();
<script src="<?php echo $url; ?>/themes/fiftyfityNew/js/jquery-1.7.1.min.js"></script>
<script src="<?php echo $url; ?>/themes/fiftyfityNew/js/jquery-ui-1.8.17.custom.min.js"></script>

1 Answer 1


The problem is that your first block of inline datepicker js is before jQuery and jQuery UI.

When you use wp_enqueue_script your script tags will be output where your wp_head() action hook is located. Move your inline datepicer js below wp_head and your jQuery should work.

enter image description here

You should also be using the no conflict wrapper for your inline datepicker js:

jQuery(document).ready(function($) {
    $("datepicker").datepicker({ });
  • still doesn't work after changing that. Don't know why. Commented Feb 22, 2012 at 4:48
  • Works for me in Safari.
    – Chris_O
    Commented Feb 22, 2012 at 4:51

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.