When you load jquery from WordPress includes, you will need to use jQuery
instead of the dollar sign $
, as the latter is reserved for other libraries.
jQuery( document ).ready(function( $ ) {
// Submitform and colorbox init, both will work here.
});
But also make sure to avoid the script tags as much as possible, but with wp_enqueue_script in the functions.php (all within <?php ?>
)
function add_our_theme_scripts() {
$theme_url = get_bloginfo('template_url') . '/js/';
// Add the wordpress version of jQuery.
wp_enqueue_script( 'jquery' );
wp_enqueue_script( 'jquery-submit-form', $theme_url . 'submit-form.js';
// similarly for colorbox if it is added through the theme.
} // END function add_our_theme_scripts()
// It should be hooked to init or wp_print_scripts and not wp_head.
add_action( 'init', 'add_our_theme_scripts' );
Now if you wish to make it more simple and manageable put the previous code in a separate file and add that to the above function too.
jQuery conflict
You can also try jQuery no conflict mode like below.
// example var myJQ.
myJQ = jQuery.noConflict();
myJQ( document ).ready(function( $ ) {
// scripts here.
});
But be careful though, $ sign will not be available after you enter noConflict mode, so make sure you use myJQ ( example here ) consistently.