wordpress enqueue script not working

Question

I am using a carousel to display latest jposts on my front page and I am using the following code but it's not working.

function my_load_caroufredsel() {
        // Enqueue carouFredSel, note that we specify 'jquery' as a dependency, and we set 'true' for loading in the footer:
        wp_register_script( 'caroufredsel', get_template_directory_uri() . '/js/jquery.carouFredSel-6.1.0-packed.js', array( 'jquery' ), '6.1.0', true );
        // For either a plugin or a theme, you can then enqueue the script:
        wp_enqueue_script( 'my-caroufredsel', get_template_directory_uri() . '/js/my-caroufredsel.js', array( 'caroufredsel' ), '', true );
    }
    add_action( 'wp_enqueue_scripts', 'my_load_caroufredsel' );

Any one can please tell what's the problem with the above code. Thanks

Answer 1

You only register your first script, but don't enqueue it. Change wp_register_script to wp_enqueue_script and it should work. Registering it is useful if you may possibly enqueue it at different times/conditions, but in this case you can just enqueue it straight away.

Answer 2

Please make sure you are utilizing wp_head() and wp_footer() functions at appropriate places in your theme?

Answer 3

After register, you have to use wp_enqueue_script('caroufredsel') or use following code

function my_load_caroufredsel() {
        // Enqueue carouFredSel, note that we specify 'jquery' as a dependency, and we set 'true' for loading in the footer:
        wp_enqueue_script( 'caroufredsel', get_template_directory_uri() . '/js/jquery.carouFredSel-6.1.0-packed.js', array( 'jquery' ), '6.1.0', true );
        // For either a plugin or a theme, you can then enqueue the script:
        wp_enqueue_script( 'my-caroufredsel', get_template_directory_uri() . '/js/my-caroufredsel.js', array( 'caroufredsel' ), '', true );
    }
add_action( 'wp_enqueue_scripts', 'my_load_caroufredsel' );

Before do that, you have to check header.php and footer.php, because in header.php you have check wp_head() code and In footer.php you have to check wp_footer(). Without that hook above code not work.

Answer 4

add below code in functions.php

add_action( 'wp_enqueue_scripts', 'my_load_caroufredsel' );
function my_load_caroufredsel() {
wp_enqueue_script( 'caroufredsel', get_stylesheet_directory_uri() . '/js/jquery.carouFredSel-6.1.0-packed.js', array('jquery'), '6.1.0', true);
wp_enqueue_script( 'my-caroufredsel', get_stylesheet_directory_uri() . '/js/my-caroufredsel.js', array( 'jquery' ), '', true );
}