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 pages if (!is_admin()){ //Load jquery core from Jquery.com directly wp_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).