How to enqueue javascript to wordpress child theme

Question

I seriously need some help before I loose my mind.

So I want to implement hamburger menu to my wordpress child theme. This one looks nice to me. https://github.com/joncoop/hamburger-menu

I downloaded the zip file, unpacked to to my computer tried it out, works like a charm.

I uploaded the files to my child theme, I did everything by the book.

Through my functions.php file I enqueued the styles and scripts appropriately.

This is the code I used:

function NovelLite_child_add_stylesheet() {
if (!is_admin()) {
wp_enqueue_style('hamburger', get_stylesheet_directory_uri() . "/css/main.css", '', '', 'all');
}
}
add_action('wp_enqueue_scripts', 'NovelLite_child_add_stylesheet');

function NovelLite_child_wp_enqueue_scripts() {

wp_enqueue_script('hamburger', get_stylesheet_directory_uri() . "/js/hamburger-menu.js");
wp_enqueue_script('neki', get_stylesheet_directory_uri() . "/js/jquery-2.1.4.min.js");


}
add_action('wp_enqueue_scripts', 'NovelLite_child_wp_enqueue_scripts');

But it's just not working. main.css stylesheet is working fine, menu looks ok, it gets the hamburger button on mobile device, but when clicked, it doesn't show the menu. This tells me that javascript is not working as it is supposed to. So I'm wondering what could be the problem. I spent 3 days figuring it out and I am stuck.

P.S. Page source shows that scripts are enqueued!

Please help

Thanks in advance

pgk · Accepted Answer · 2016-02-10 10:11:21Z

2

Maybe the problem is in jQuery - your menu needs for it, but you're include it after hamburger js. Try this :

wp_enqueue_script('hamburger', get_stylesheet_directory_uri() . "/js/hamburger-menu.js", array('jquery'));

to tell WP to load WP embeded jquery before hamburger.js and to use it for 'hamburger.js`.

Also if this works, no need to load external jquery here:

wp_enqueue_script('neki', get_stylesheet_directory_uri() . "/js/jquery-2.1.4.min.js");

But if you want to use your jquery file must change hamburger enqueue script to use your jquery file like this:

wp_enqueue_script('hamburger', get_stylesheet_directory_uri() . "/js/hamburger-menu.js", array('neki'));

edited Feb 10, 2016 at 10:11

answered Feb 10, 2016 at 10:04

pgk

1,4771 gold badge21 silver badges22 bronze badges

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

2 Comments

LeeLB Over a year ago

Thank you very much! First line with array('jquery') works. I also deleted second line which was loading external jquery. I actually think I tried this before, I don't know what happend then :) But in any case this worked great. Cheers!

Anish Rai Over a year ago

wp_enqueue_script( 'theme-script1', get_stylesheet_directory_uri() . '/assets/js/main.js'); Is not working in my case. I am using in child theme.I try all the alternative.but no luck . can you please anyone help me. Thanks in advanced

Collectives™ on Stack Overflow

How to enqueue javascript to wordpress child theme

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related