linking javascript file to wordpress child theme

2 Views

I’m trying to link a javascript file to my child theme. I’ve looked at the WordPress Codex and numerous examples, but it still is not working. I’m working on localhost, so from what I have read, i want to use the get_stylesheet_directory(). I’ve echoed it out and it is pointing to the correct path. Below is my code that is placed in my functions.php child theme: 

add_action( 'wp_enqueue_scripts', 'theme_js' );
function theme_js() {
wp_enqueue_script( 'theme_js', get_stylesheet_directory() . '/js/theme.js',    array('jquery'), '', true );
}

My javascript file looks like this:

/**
 * Custom Theme Styles
 */
( function( $ ) {

$('.main-navigation li a').click(function() {
    var link = $(this).attr('href');
    $('html, body').animate({
    scrollTop: $(link).offset().top
    }, 1500);
});
 })( jQuery );
Post Views: 2

Related posts

Leave a Reply

2 comments

  1. The src string in the enqueue needs to be a URL, not a path, so you need to use get_stylesheet_directory_uri() instead of get_stylesheet_directory():

    add_action( 'wp_enqueue_scripts', 'theme_js' );
function theme_js() {
    wp_enqueue_script( 'theme_js', get_stylesheet_directory_uri() . '/js/theme.js',    array('jquery'), '', true );
}