Tag Archives: Javascript

wp_enqueue_script() – the recommended method of adding JavaScript to WordPress

This function includes the script if it hasn’t already been included, and safely handles dependencies (scripts that must be loaded before the script).

<?php wp_enqueue_script( $handle, $src, $deps, $ver, $in_footer );?>

$handle is the name of the script in lowercase.

$src (optional) URL to the script. This parameter is only required when WordPress does not already know about this script. You should never hardcode URLs to local scripts, use get_template_directory_uri() (for Themes) and plugins_url() (for Plugins).

$deps (optional) array of handles (lowercase names) of any script that this script depends on. This parameter is only required when WordPress does not already know about this script.

$ver (optional) string specifying the script version number. This parameter is used to ensure that the correct version is sent to the client regardless of caching, and so should be included if a version number is available.

$in_footer (optional) boolean of whether or not the script should be loaded at the bottom of the <body>. Default is false.

 

This following code will load the version of jQuery that comes with WordPress on both the front end and the admin side. It will only load if jQuery it has not yet been included. This code needs to be placed before wp_head().

<?php wp_enqueue_script('jquery'); ?>

 

The example below

  • only loads the fancybox script on the front end, via use of the wp_enqueue_scripts action hook
  • uses get_stylesheet_directory_uri() for the path to the fancybox script
  • loads the script’s dependency jquery before loading the fancybox script
  • loads version 1.2.6 of the fancybox script
<?php
function my_scripts_method() {
    wp_enqueue_script('jquery');
    wp_enqueue_script(
        'jquery.fancybox',
        get_stylesheet_directory_uri() . '/js/jquery.fancybox.js',
        array('jquery'),
        '1.2.6'
    );
}
add_action('wp_enqueue_scripts', 'my_scripts_method');
?>

 

wp_enqueue_scripts() in the WordPress Codex