Where to put which files when adding Javascript to Wordpress

Question

I'm trying to figure out how to get ANY Javascript to work and where to place the files.

I tried several ways but what is the most logical way? I've been trying for a week, but since I can't find a tutorial on it, I'm going to assume it's embarrassingly easy.

I'm just trying to understand where to put which files before I venture further into this coding journey.

Any help is much much appreciated!

What I've done so far:

I created a Childtheme and added the hook-code to the functions.php file (see image) There seem to be double code here but I'm not sure
I acquired the files for a .js slider (tried several) but I'm not sure where to put the code/files
The HTML I put in a HTML widget top of page, the CSS I put in Wordpress' 'Additional CSS' and the Javascript I put in the functions.php between the brackets.
I also tried to add the code files in the ChildTheme folder but also didn't work

WordPress Theme Handbook explains themes. @Diego explained how to add javascript to every page. But if you only want to load slider scripts on one page, create a custom page template. — WhereDidMyBrainGo
– WhereDidMyBrainGo, Commented Nov 29, 2022 at 3:23

Diego · Accepted Answer · 2022-11-28 16:51:06Z

1

In wordpress you have no real place for javascript files, that means that you are quite free to place them where u feel beeter.

That said, it is common to have inside your child theme a "js" folder, which could be in the root of the child theme like:

mychildtheme/js or mychildtheme/assets/js or mychildtheme/public/js

Once u've picked one of those, all you have to do is this:

add_action( 'wp_enqueue_scripts', 'my_custom_scripts' );
function my_custom_scripts(){
    wp_enqueue_script('my_custom_script',get_stylesheet_directory_uri()."/[yourpath]/yourfile.js",['jquery','anyotherdeps'],false,true);
}

Which is documented here: https://developer.wordpress.org/reference/functions/wp_enqueue_script/

answered Nov 28, 2022 at 16:51

Diego

1,7461 gold badge17 silver badges30 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Tomzor Over a year ago

Yesss got it! Thank you so much!

Collectives™ on Stack Overflow

Where to put which files when adding Javascript to Wordpress

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related