jQuery scripts not loading in WordPress

Question

I tried to attach my scripts to WordPress. I read all topics and tried all but did not get the solution, so i created a fake WordPress theme and uploaded it. Please, if you can solve this let me know.

Here is the file: my theme

Using Flexslider Sticky Header and Responsive Navigation I guess that wp_enqueue_script does not work.

function theme_name_scripts() {

wp_enqueue_script( 'my-scripts', get_template_directory_uri() . '/js/myscripts.js', array(),'1.0.0', true );
wp_enqueue_script( 'masonry', get_template_directory_uri() . '/js/masonry.pkgd.min.js', array(), '1.0.0', true );
wp_enqueue_script( 'flex-min', get_template_directory_uri() . '/js/jquery.flexslider-min.js', 'jquery' );   
wp_enqueue_script( 'flex', get_template_directory_uri() . '/js/jquery.flexslider.js', 'jquery' );   

}

Please edit my theme.

thanks

call this function in some hook theme_name_scripts( like init etc. — Subodh Ghulaxe
– Subodh Ghulaxe, Commented Feb 22, 2014 at 13:33

Community · Accepted Answer · 2020-06-20 09:12:55Z

1

OK here are the steps to take to resolve your issue.

1) Check you've added necessary actions.

Open up header.php inside your theme folder. Check that before the tag you have the wp_head action.

<?php wp_head(); ?>

Open up footer.php and before the closing body tag check you have the wp_footer tag.

<?php wp_footer(); ?>

These tags are necessary for the scripts to be added correctly.

2) Check your JS exists.

Next up is really simple. Open the JS folder and check the files you're attempting to load exist. WordPress will ignore them completely if they don't exist instead of adding a broken URL.

3) Check you're using the correct hook.

I noticed some comments / answers suggested use of init or wp_footer as the hook to load your JS but this is incorrect. You need to use the wp_enqueue_scripts hook. This should be placed inside functions.php

function theme_name_scripts() {

    wp_enqueue_script( 'my-scripts', get_template_directory_uri() . '/js/myscripts.js', array(),'1.0.0', true );
    wp_enqueue_script( 'masonry', get_template_directory_uri() . '/js/masonry.pkgd.min.js', array(), '1.0.0', true );
    wp_enqueue_script( 'flex-min', get_template_directory_uri() . '/js/jquery.flexslider-min.js', 'jquery' );   
    wp_enqueue_script( 'flex', get_template_directory_uri() . '/js/jquery.flexslider.js', 'jquery' );   

}
add_action( 'wp_enqueue_scripts', 'theme_name_scripts' );

If you're still having an issue let me know and I'll go over further possibilities however the likelihood of that being necessary is slim. Also I'd like to highlight the name of the action is wp_enqueue_scripts. I've noticed a number of similar questions lately where the problem has been users have forgotten the 's'.

edited Jun 20, 2020 at 9:12

CommunityBot

11 silver badge

answered Feb 22, 2014 at 14:27

Nathan Dawson

19.4k3 gold badges59 silver badges60 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Beginner Over a year ago

now i did 3 steps that u said , still not working :D perhaps my js code are wrong or wordpress i dont know , please check here jsfiddle.net/WRhgE

Nathan Dawson Over a year ago

Just to clarify are you saying the code isn't loading or it isn't working? If you view the source are the JS files there?

Beginner Over a year ago

the js codes isn't loading*** , yes JS files are there

Subodh Ghulaxe · Accepted Answer · 2014-02-22 13:34:52Z

0

Try this

<?php

function theme_name_scripts() {

    wp_enqueue_script( 'my-scripts', get_template_directory_uri() . '/js/myscripts.js', array(),'1.0.0', true );
    wp_enqueue_script( 'masonry', get_template_directory_uri() . '/js/masonry.pkgd.min.js', array(), '1.0.0', true );
    wp_enqueue_script( 'flex-min', get_template_directory_uri() . '/js/jquery.flexslider-min.js', 'jquery' );   
    wp_enqueue_script( 'flex', get_template_directory_uri() . '/js/jquery.flexslider.js', 'jquery' );   
}
add_action('wp_footer', 'theme_name_scripts'); 


?>

answered Feb 22, 2014 at 13:34

Subodh Ghulaxe

18.7k15 gold badges87 silver badges103 bronze badges

1 Comment

Beginner Over a year ago

oh yeah , sorry i forgot that write it to question

Felix · Accepted Answer · 2014-02-22 13:41:13Z

0

Try to place your myscripts.js after you've included flexslider scripts:

function theme_name_scripts() {
    wp_enqueue_script( 'masonry', get_template_directory_uri() . '/js/masonry.pkgd.min.js', array(), '1.0.0', true );
    wp_enqueue_script( 'flex-min', get_template_directory_uri() . '/js/jquery.flexslider-min.js', 'jquery' );   
    wp_enqueue_script( 'flex', get_template_directory_uri() . '/js/jquery.flexslider.js', 'jquery' );
    wp_enqueue_script( 'my-scripts', get_template_directory_uri() . '/js/myscripts.js', array(),'1.0.0', true );
}

answered Feb 22, 2014 at 13:41

Felix

38.2k8 gold badges46 silver badges56 bronze badges

1 Comment

Felix Over a year ago

try to remove one flexslider script, you've two here

Collectives™ on Stack Overflow

jQuery scripts not loading in WordPress

3 Answers 3

1) Check you've added necessary actions.

2) Check your JS exists.

3) Check you're using the correct hook.

3 Comments

1 Comment

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1) Check you've added necessary actions.

2) Check your JS exists.

3) Check you're using the correct hook.

3 Comments

1 Comment

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related