1

I just put my website on the Web and noticed that the menu is not really working.Nothing happens when I click on it and when Inspect the element s I actually don't see the scripts. All works perfectly in the localhost though.

Here my function.php:

function scentology_scripts() {

        wp_enqueue_style( 'scentology-local-fonts', get_template_directory_uri() . '/fonts/raleway.css' );                   

        wp_enqueue_style( 'scentology-style-fontawesome', 'https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css' );

    wp_enqueue_style( 'scentology-style', get_stylesheet_uri() );

//        wp_enqueue_script( 'scentology-style', get_template_directory_uri() . '/js/scrollspy.js', array(jquery), '20151215', true );

        wp_enqueue_script( 'scentology-menu', get_template_directory_uri() . '/js/menu.js', array('jquery'));
        wp_enqueue_script( 'scentology-menu');

    wp_enqueue_script( 'scentology-navigation', get_template_directory_uri() . '/js/navigation.js', array(), '20151215', true );

    wp_enqueue_script( 'scentology-skip-link-focus-fix', get_template_directory_uri() . '/js/skip-link-focus-fix.js', array(), '20151215', true );

    if ( is_singular() && comments_open() && get_option( 'thread_comments' ) ) {
        wp_enqueue_script( 'comment-reply' );
    }
}
add_action( 'wp_enqueue_scripts', 'scentology_scripts' );

and my jquery code:

(function( $ ){      
   $(".burguer-nav").on("click", function() {      
        $("header nav ul").toggleClass("open"); 
    });     
})(jQuery);

Is there another way for me to load the scripts?

1

I dont really see anything wrong on what I did previously. But in any case I changed the name of the file to navbar.js and then my functions.php looked like this:

function scentology_scripts() {
    wp_enqueue_style( 'scentology-local-fonts', get_template_directory_uri() . '/fonts/raleway.css' );
    wp_enqueue_style( 'scentology-style-fontawesome', 'https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css' ); 

    wp_enqueue_style( 'scentology-style', get_stylesheet_uri() ); 

    wp_enqueue_script( 'scentology-menu', get_template_directory_uri() . '/js/navbar.js', array('jquery'), '20151215', true);

    wp_enqueue_script( 'scentology-navigation', get_template_directory_uri() . '/js/navigation.js', array('jquery'), '20151215', true );

//    wp_enqueue_script( 'scentology-style', get_template_directory_uri() . '/js/scrollspy.js', array(jquery), '20151215', true );

    wp_enqueue_script( 'scentology-skip-link-focus-fix', get_template_directory_uri() . '/js/skip-link-focus-fix.js', array('jquery'), '20151215', true );

    if ( is_singular() && comments_open() && get_option( 'thread_comments' ) ) {
     wp_enqueue_script( 'comment-reply' ); 
    }
}
add_action( 'wp_enqueue_scripts', 'scentology_scripts' );
0
function scentology_scripts() {
    wp_enqueue_style( 'scentology-local-fonts', get_template_directory_uri() . '/fonts/raleway.css' );
    wp_enqueue_style( 'scentology-style-fontawesome', 'https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css' ); 

    wp_enqueue_style( 'scentology-style', get_stylesheet_uri() ); 

    wp_enqueue_script( 'scentology-menu', get_template_directory_uri() . '/js/menu.js', array('jquery'), '20151215', true);

    wp_enqueue_script( 'scentology-navigation', get_template_directory_uri() . '/js/navigation.js', array('jquery'), '20151215', true );

    wp_enqueue_script( 'scentology-skip-link-focus-fix', get_template_directory_uri() . '/js/skip-link-focus-fix.js', array('jquery'), '20151215', true );

    if ( is_singular() && comments_open() && get_option( 'thread_comments' ) ) {
     wp_enqueue_script( 'comment-reply' ); 
    }
}
add_action( 'wp_enqueue_scripts', 'scentology_scripts' );

Now add your custom jquery code in navigation.js (or may be a different js file).

1 You don't need to enqueue jquery separately.

2 I guess you have confused between wp_register_script and wp_enqueue_script. Read about these two functions to clear your confusion.

  • I don't quite follow. What is in my code that shouldn't be there? I copied and pasted your script snippet in my functions.php and also placed the jquery code under the navigation.js but it still happens nothing. – deSousa Aug 23 '16 at 12:54
  • Don't copy and paste just make sure the you are doing in correct way.. also check page source what is loading and what not.. then check your final jquery code.. i haven't check validity of your last jquery code .. my answer is valid upto loading those files but not for the click .. – Rituparna sonowal Aug 23 '16 at 16:47
  • @Wosley Alarico please don't leave your question open if you have already solved it. Mark it resolved. – Rituparna sonowal Aug 25 '16 at 5:21
  • @dgfdgfdgfd.Actually forgot to put my comment as an answer. Appreciate the reminder. – deSousa Aug 25 '16 at 9:01
0

it is worth mentioning that you may want to enable the WP_DEBUG constant on the wp-config.php on your local to true.

Also get_template_dir_uri() will work as long as it is the parent theme and not a child, the child theme needs to use get_stylesheet_directory_uri() for scripts present in the child theme folder. finally make sure your sources are where they are supposed to be and for good practice remove any http: https: from hardcoded url sources such as //maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css.

as far as i can tell check your console and check how the scripts are being printed in the footer. there may also be some jquery errors or conflicts. Looks like you are using parts of bootstrap so make sure you are including all the needed scripts for those components to work

-1

You need to add your jquery.js file first and then enqueue rest of the JS file.

Updated code :

function scentology_scripts() {

     wp_enqueue_style( 'scentology-local-fonts', get_template_directory_uri() . '/fonts/raleway.css' );                   

     wp_enqueue_style( 'scentology-style-fontawesome', 'https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css' );

     wp_enqueue_style( 'scentology-style', get_stylesheet_uri() );

     wp_enqueue_script( 'jquery' ); 

     //   wp_enqueue_script( 'scentology-style', get_template_directory_uri() . '/js/scrollspy.js', array(jquery), '20151215', true );

     wp_enqueue_script( 'scentology-menu', get_template_directory_uri() . '/js/menu.js', array('jquery'));
     wp_enqueue_script( 'scentology-menu');
     wp_enqueue_script( 'scentology-navigation', get_template_directory_uri() . '/js/navigation.js', array(), '20151215', true );
     wp_enqueue_script( 'scentology-skip-link-focus-fix', get_template_directory_uri() . '/js/skip-link-focus-fix.js', array(), '20151215', true );

    if ( is_singular() && comments_open() && get_option( 'thread_comments' ) ) {
        wp_enqueue_script( 'comment-reply' );
    }
}
add_action( 'wp_enqueue_scripts', 'scentology_scripts' );
  • I don't think that this is the issue,but considering your statement I commented all other scripts that I enqueued and it did not work. – deSousa Aug 23 '16 at 12:37
  • Are you getting any error in console ? and in which js file you have your jquery code. – Aftab Aug 23 '16 at 12:45
  • I now added the jquery code into the navigation.js file. – deSousa Aug 23 '16 at 12:56
  • Are you using child theme? – Aftab Aug 23 '16 at 13:27
  • I dont know what different I did but I restarted the machine,changed the name of the files and it now works – deSousa Aug 24 '16 at 7:33

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.