CODEWITHSUNDEEP
javascriptphpjquerycsswordpress
LeeLB
LeeLB

Reputation: 11

How to enqueue javascript to wordpress child theme

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

Upvotes: 0

Views: 2341

Answers (1)

pgk
pgk

Reputation: 1477

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'));

Upvotes: 2

Related Questions