I think there is a conflict with the way WordPress uses jQuery:
Tried:
(function($) {
$(document).ready(function(){
alert('hello');
});
}(jQuery));
Tried also:
$(document).ready(function(){
alert('hello');
});
And Firebug dumps:
jQuery is not defined
[Detener en este error] }(jQuery));
And also tried:
jQuery.noConflict();
jQuery(document).ready(function($) {
alert("hello");
});
and Firebug:
jQuery is not defined
[Detener en este error] jQuery.noConflict();
And jQuery is imported
Any idea what am i missing?
5 Answers 5
It looks like jQuery is not available (neither the $ variable nor jQuery were defined). In your particular case, it's because the library is not loaded at all. Put the next code in your <head> section before your the scripts requiring jQuery:
<script src="//code.jquery.com/jquery-1.6.4.min.js"></script>
2 Comments
How are you including jquery? Whatever the case may be, its not happening (check out the head / check out the page DOM via firebug - no $ or jQuery references).
The correct way to link the hosted version of jquery (and in this case, a dependent plugin) in wordpress looks like this:
in functions.php (or a plugin... or whatever)
// register scripts
if (! function_exists(thickbox_register){
function thickbox_register() {
wp_deregister_script( 'jquery' );
wp_register_script( 'jquery','http://ajax.googleapis.com/ajax/libs/jquery/1.6/jquery.min.js');
wp_register_script( 'thickbox', 'path to thickbox'.thickbox.js, 'jquery');
}
}
add_action('init', 'thickbox_register');
//print the now registered scripts
if (! function_exists(thickbox_enqueue){
function thickbox_enqueue() {
wp_enqueue_script( 'jquery' );
wp_enqueue_script( 'thickbox' );
}
}
add_action('wp_print_scripts', 'thickbox_enqueue');
// do the same for css
if (! function_exists(thickbox_style_enqueue){
function thickbox_style_enqueue() {
wp_register_style( 'thickbox', 'path to css'.thickbox.css );
wp_enqueue_style( 'thickbox' );
}
}
add_action('wp_print_styles', 'thickbox_style_enqueue');
To ensure wordpress delivers the correct scripts at the correct time, you must add actions to the init and register script wordpress methods.
Hope that helps
Comments
even if your document works now, for better practive :
- change all your $ sign with "Jquery" . (conflicting with wordpress core)
- you are not declaring class or id .
for example in your code :
$('header').hide();
should be
jQuery('#branding').hide();
and
$('body').css('position','relative');
should be
jQuery('.home').css('position','relative');
your code is semantic , where header is not a tag, but a tag , meaning header is not a class or id (rather #branding is an id ) and body as well (rather .home or .blog) better practice would be to declare the class .
Comments
Checked the URL you have posted and there seems to be no reference to jQuery.
Include the below code inside head
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"> </script>
Comments
Try putting this code in <head>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.6.4.min.js"></script>
$andjQueryaren't defined in the firebug console?