How to Load Custom Javascript Script in WordPress

While there are a number of articles out there showing you how to properly load jquery in WordPress, none of them seem to show you how to load a custom javascript script in WordPress.

This is how you load custom javascript / jquery script into WordPress in Genesis.

/** Load the scripts at the bottom of the page to increase performance and user experience This is Genesis specific and may vary depending on WordPress theming framework*/add_action('genesis_after_footer', 'load_custom_js');function load_custom_js() {//Only load the scripts on non-admin pagesif (!is_admin()){//Load jquery core from Jquery.com directlywp_enqueue_script('my_jquery','http://code.jquery.com/jquery-1.10.1.min.js',array( 'jquery' ));//Load custom jquery or js script from child theme folder wp_enqueue_script('my_custom_js',get_stylesheet_directory_uri().'/js/customjs.js',array( 'jquery' ));}}

The most important line in the above code snippet is:
wp_enqueue_script(‘my_custom_js’,get_stylesheet_directory_uri().’/js/customjs.js’,array( ‘jquery’ ));

my_custom_js is the script handler. Could call it anything.

get_stylesheet_directory_uri() is an inbuilt WP function that gets the file url of your stylesheet directory, which is especially useful in the Genesis framework as this gets your child theme directory file url.

js/customjs.js is the name of your custom js script and the folder it is stored in (js).