0

I have successfully been using jpanelmenu in my wordpress themes for some time, loading jquery from the google api, like this:

if ( !is_admin() ) { // jQuery wp_deregister_script('jquery'); wp_register_script('jquery', ("http://ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"), false); wp_enqueue_script('jquery'); // load jPanelMenu wp_enqueue_script('jpanelmenu', get_bloginfo('template_directory') . "/js/jquery.jpanelmenu.js"); }

I'd rather use the version of jquery that comes included with wordpress, but can't figure out how to make that happen. Can anyone advise me on how to do that, or tell me if I'm wrong in thinking that using wp's built-in jquery would be better than what I'm doing in the code above?

I am instantiating jpanelmenu like this:

$(document).ready(function () { var jPM = $.jPanelMenu({ duration: 100, openPosition: "240px", direction: "left", keyboardShortcuts: false }); jPM.on(); // turn on jPanelMenu });

Thanks in advance!

edited

Based on the answers below I tried the following, but jpanelmenu would not function (clicking on the menu trigger does not reveal the off-canvas menu):

function wpa_132328_enqueue_scripts(){ if ( !is_admin() ) { // jQuery wp_enqueue_script('jquery'); // load jPanelMenu wp_enqueue_script('jpanelmenu', get_bloginfo('template_directory') . "/js/jquery.jpanelmenu.js"); } } add_action( 'wp_enqueue_scripts', 'wpa_132328_enqueue_scripts' );

and

if ( !is_admin() ) { // jQuery wp_enqueue_script('jquery'); // load jPanelMenu wp_enqueue_script('jpanelmenu', get_bloginfo('template_directory') . "/js/jquery.jpanelmenu.js"); }

and

wp_enqueue_script('jpanelmenu', get_bloginfo('template_directory') . "/js/jquery.jpanelmenu.js", array('jquery') );

and

if ( !is_admin() ) { wp_enqueue_script('jpanelmenu', get_bloginfo('template_directory') . "/js/jquery.jpanelmenu.js", array('jquery') ); }
Improve this question
3
  • Define "would not function". We can't help you unless you give us information to go on. Holding back on the code and the surrounding situation won't get you any answers you can use.
    – Otto
    CommentedFeb 4, 2014 at 2:14
  • Apologies for not going into greater detail. When jpanelmenu is functioning correctly, clicking on the menu trigger reveals the off-canvas menu. By "would not function" I mean that clicking on the menu trigger does nothing. The off-canvas menu is not revealed. Nothing happens at all. My sense is that jquery is not being loaded and so the jpanelmenu script can't function. I'll happily give more information if needed, just let me know if I'm not being clear or providing enough context. Thanks so much for your time! I really appreciate it.
    – dadra
    CommentedFeb 4, 2014 at 2:31
  • I also tried deactivating all plugins and stripping out all other functions from function.php. Just trying to rule out any conflicts. Again, clicking on the menu trigger does not reveal the off-canvas menu. Nothing happens on click. Thanks!
    – dadra
    CommentedFeb 4, 2014 at 4:26

2 Answers 2

Reset to default
1

To use the WordPress-bundled version, simply stop de-registering it and replacing it with the Google version.

function wpa_132328_enqueue_scripts(){ if ( !is_admin() ) { // jQuery wp_enqueue_script('jquery'); // load jPanelMenu wp_enqueue_script('jpanelmenu', get_bloginfo('template_directory') . "/js/jquery.jpanelmenu.js"); } } add_action( 'wp_enqueue_scripts', 'wpa_132328_enqueue_scripts' );

"$ is not defined" errors means you aren't in noconflict mode. Adjust your code as follows:

jQuery(document).ready(function ($) { var jPM = $.jPanelMenu({ duration: 100, openPosition: "240px", direction: "left", keyboardShortcuts: false }); jPM.on(); // turn on jPanelMenu });
Improve this answer
7
  • Thanks for the quick response! I replaced my code with your suggestion but jpanelmenu no longer functioned. Any other thoughts?
    – dadra
    CommentedFeb 3, 2014 at 23:48
  • It's possible that the jpanelmenu code is not correctly written for jquery noconflict mode, but without knowing what's in that code, there's no way to answer.
    – Otto
    CommentedFeb 4, 2014 at 0:03
  • Look in your web developer console (F12 in chrome), what kind of script errors are you getting? Also, you haven't posted it but did you instantiate the plugin by calling the plugin constructor function? Just loading the core plugin isn't enough if you never tell it to 'turn on'. See the "how do I use this thing" over at the jPanel site.
    – helgatheviking
    CommentedFeb 4, 2014 at 9:46
  • Thanks Helga. I have edited my original question to show how I've been instantiating the plugin. When trying your solution, Chrome javascript console flags my instantiating code and says: Uncaught ReferenceError: $ is not defined (anonymous function) When trying Otto's code, I get this: Uncaught TypeError: Property '$' of object [object Object] is not a function (anonymous function)
    – dadra
    CommentedFeb 4, 2014 at 15:37
  • That error means you aren't in noconflict mode. See my edit.
    – helgatheviking
    CommentedFeb 4, 2014 at 17:05
2

The correct way to enqueue something that depends on jQuery is like so:

wp_enqueue_script('jpanelmenu', get_bloginfo('template_directory') . "/js/jquery.jpanelmenu.js", array('jquery') );

You don't need to enqueue jQuery itself. The dependency takes care of that for you.

And if you're hooking it to the wp_enqueue_scripts action hook correctly, you don't need the is_admin check.

Improve this answer
5
  • Thanks Otto. I just tried that but jpanelmenu stopped working. Might this be because of the potential noconflict mode incompatibility you mentioned in your other comment?
    – dadra
    CommentedFeb 4, 2014 at 0:13
  • Yes, please provide more information about what this jpanelmenu is, where we can see the code, etc.
    – Otto
    CommentedFeb 4, 2014 at 0:14
  • 1
    The code shown here is fine and will work with jquery in noconflict mode: jpanelmenu.com/jquery.jpanelmenu.js If you're still having trouble, try editing your question and showing what you're doing now that you say does not work.
    – Otto
    CommentedFeb 4, 2014 at 0:24
  • 1
    What you posted doesn't help, because you don't give us any clues as to what is not working for you. My answer is correct, and I tested it myself just to be sure. It works fine. So, what exactly does not work for you?
    – Otto
    CommentedFeb 4, 2014 at 2:12
  • Thanks Otto. I'm glad to know you were able to get it to work using the answer you provided. Unfortunately it's not working for me, so something just isn't right on my end. Please see my edited question and additional comments, including what I wrote to helgatheviking. Hopefully this can help us figure out what's wrong. Thank you!
    – dadra
    CommentedFeb 4, 2014 at 16:13

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.