I am trying to load a separate javascript file mobile-menu.js to my Wordpress theme. When I look at the console, it says, "jQuery is not defined." However, I know that I enqueued my script files correctly. Any ideas?
HTML file:
<a href="#" id="menu-icon"></a> <!--this line wasn't here originally--> <div id="switchmenu"><!--switchmenu begin--> <?php wp_nav_menu( array( 'theme_location' => 'primary' ) ); ?> </div><!--switchmenu end-->
functions.php file:
function lapetitefrog_scripts() { wp_enqueue_style( 'lapetitefrog-style', get_stylesheet_uri() ); wp_enqueue_script( 'lapetitefrog-mobile-menu', get_template_directory_uri() . '/js/mobile-menu.js', array(), '1.0', true ); } add_action( 'wp_enqueue_scripts', 'lapetitefrog_scripts' );
mobile-menu.js file:
jQuery(document).ready(function($) { $('#menu-icon').click(function() { $('#switchmenu').slideToggle("fast"); }); });
WordPress automatically loads it along with the user script. Here is an example code. This code adds a custom javascript and calls jQuery as its dependency. wp_enqueue_script( 'custom-script' , get_stylesheet_directory_uri() .
Add wp_enqueue_script('jquery');
before you enqueue your scripts.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With