Sending jQuery to WordPress Front End

WordPress front end has two section we can use to send or enqueue the jQuery or other javascript files. It is in the site header wp_head and in the footer wp_footer. We can use one of this section to enqueue files or print custom inline javascript code. A builtin function wp_enqueue_script and add_action to hook a function to a specific action was provided to make it simple. We can make this by editing the theme function.php. Open the file and add the following code:

Custom function

This function will call the jQuery and enqueue it for next process.

function my_jquery_function() {
    wp_enqueue_style( 'jquery' );

Sending jQuery to header

Sending jQuery to the header can be done with wp_head hook.

add_action( 'wp_head', 'my_jquery_function' );

Sending jQuery to the footer can be done with wp_footer hook.

add_action( 'wp_footer', 'my_jquery_function' );

Now we can add our custom jQuery plugin file or custom inline jQuery or javascript function after enqueue jQuery to the header or footer.

8 comments on “Sending jQuery to WordPress Front End

  1. I’ve added that code to the functions.php, and added the custom script and stylesheet, but it still will not open in a new window. Am I missing something?

    1. SyntaxError: illegal character

      Please make sure you type the right one, remove unnecessary characters.

    2. I’m not really sure where you’re getting that. I copied and pasted the code that you have above.

Create Comment

Your email address will not be published. Required fields are marked *