4

i added code in my footer.php just before the but the code is not executed. I know it's better to use functions.php but i would like to test like this for the moment... Could someone help me please ? thanks

<script type="text/javascript">
   window.onload = function () {  
        jQuery(document).ready(function(){ console.log('insider');
            var alphabeticallyOrderedDivs = $('.team-member').sort(function(a, b) {     
                return  String.prototype.localeCompare.call($(a).data('lastname').toLowerCase(), 
                $(b).data('lastname').toLowerCase()); 
    });
    var container = $('.ulcontainer');
    container.detach().empty().append(alphabeticallyOrderedDivs);
    $('body').append(container);})
   }(jQuery);

</script>
3
  • I think theme you are using enqueue all js in wp_footer hook. Try to add your js After wp_footer and check it. Oct 26, 2017 at 15:34
  • sorry but i put direly in footer.php before </body> and jQuery(document).ready(function() is not executed
    – Pipoo
    Oct 26, 2017 at 16:26
  • here it works without adding JS in settings but when adding jQuery it does not work anymore ...jsfiddle.net/xo5nopyx
    – Pipoo
    Oct 26, 2017 at 16:40

1 Answer 1

5

By Using wp_enqueue_script()

You can add your scripts to a JS file and then enqueue it properly. I assume you have added your scripts to file.js. Here's how you enqueue it in the footer:

add_action('wp_enqueue_scripts','my_script_callback');
function my_script_callback(){
    wp_enqueue_script(
        'my-script',
        get_template_directory_uri().'/folder/file.js',
        array(jquery),
        null,
        true
    );
}

The last argument in wp_enqueue_script() determines whether your script should be enqueued in the footer or not.

The 3rd argument is optional, and is an array of dependencies.

By Using wp_footer()

You can also directly print your scripts in the footer, which is not always the best idea. However, this is how you do it:

function my_script() { ?>
    <script type="text/javascript">
        // Your code here
    </script><?php
}
add_action( 'wp_footer', 'my_script' );

Not that you have to wait for jQuery to be ready in such a method. You can enqueue jQuery if not already enqueue, by using this:

add_action( 'wp_head' , 'enqueue_jquery' )
function enqueue_jquery() {
    wp_enqueue_script( 'jquery' );
}
6
  • thanks but first i would like to know why this script is not executed directly in footer
    – Pipoo
    Oct 26, 2017 at 14:52
  • What error do you receive? It's probably because jQuery isn't available at that point
    – Johansson
    Oct 26, 2017 at 14:54
  • no error but console.log('insider') is not traced. I thought with ONLOAD i was sure that Jquery would be loaded.
    – Pipoo
    Oct 26, 2017 at 14:56
  • Maybe you don't have jQuery enqueued. Debugging such an issue is hard to tell without actually seeing what's going on
    – Johansson
    Oct 26, 2017 at 14:58
  • does it exist a variable that indicates if Jquery is loaded that i could trace ?
    – Pipoo
    Oct 26, 2017 at 15:03

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

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