I want to apply some javascript to my header and want to know what the best way to implement it is.
here is the source that contains the javascript I'm including - /
Should I create a new javascript file then add it to the child theme, if so then I'm unsure of what to call the file and will it apply to the head from this location?
I want to apply some javascript to my header and want to know what the best way to implement it is.
here is the source that contains the javascript I'm including - https://codepen.io/kaemak/pen/mHyKa/
Should I create a new javascript file then add it to the child theme, if so then I'm unsure of what to call the file and will it apply to the head from this location?
2 Answers
Reset to default 28You should enqueue the script in child theme's functions.php. for example if name of the js file is custom.js and if you place it under js folder in your child theme, then in functions.php you should add
function my_custom_scripts() {
wp_enqueue_script( 'custom-js', get_stylesheet_directory_uri() . '/js/custom.js', array( 'jquery' ),'',true );
}
add_action( 'wp_enqueue_scripts', 'my_custom_scripts' );
Here get_stylesheet_directory_uri() will return the directory of your child theme, then array( 'jquery' ) would make your js load after jquery, if your script requires js then you should use this else you can remove or you can add the dependent script here, then the last parameter true, is to make your js load at the footer.
Yes, create a new JavaScript file and just call it wherever you want, I would suggest to call it under footer that's the best way to call js files. You can add below code to your footer:
<script src="<?php echo get_template_directory_uri(); ?>/filename.js"></script>