Codex

Function Reference/wp enqueue script

Contents

Description

A safe way of adding javascripts to a WordPress generated page.

Usage

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

Parameters

$handle
(string) (required) Name of the script. Lowercase string.
Default: None
$src
(string) (optional) Path to the script from the root directory of WordPress. Example: "/wp-includes/js/scriptaculous/scriptaculous.js". This parameter is only required when WordPress does not already know about this script.
Default: None
$deps
(array) (optional) Array of handles of any script that this script depends on; scripts that must be loaded before this script. false if there are no dependencies. This parameter is only required when WordPress does not already know about this script.
Default: None
$ver
(string) (optional) String specifying the script version number, if it has one. Defaults to false. 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 and makes sense for the script.
Default: None

Example

Load the scriptaculous script: <?php
function my_init_method() {
    
wp_enqueue_script('scriptaculous');            
}    
 
add_action('init'my_init_method);
?>

Add and load a new script that depends on scriptaculous (this will also cause it to load scriptaculous into the page as well): <?php
wp_enqueue_script
('newscript',
 
'/' PLUGINDIR '/someplugin/js/newscript.js',
 array(
'scriptaculous'),
 
'1.0' );
?>

Note: This function will not work if it is called from a wp_head action, as the <script> tags are output before wp_head runs. Instead, call wp_enqueue_script from an init action function (to load it in all pages), template_redirect (to load it in public pages only), or admin_print_scripts (for admin pages only). Do not use wp_print_scripts (see here for an explanation).

Default scripts included with WordPress

Note: The jQuery library included with Wordpress loads in "no conflict" mode. In order to use the $ function as usual, use the following:

jQuery(document).ready(function($) {
    // $() will work as an alias for jQuery() inside of this function
});
Script Name Handle
Scriptaculous Root scriptaculous-root
Scriptaculous Builder scriptaculous-builder
Scriptaculous Drag & Drop scriptaculous-dragdrop
Scriptaculous Effects scriptaculous-effects
Scriptaculous Slider scriptaculous-slider
Scriptaculous Sound scriptaculous-sound
Scriptaculous Controls scriptaculous-controls
Scriptaculous scriptaculous
Image Cropper cropper
SWFUpload swfupload
SWFUpload Degarade swfupload-degrade
SWFUpload Queue swfupload-queue
SWFUpload Handlers swfupload-handlers
jQuery jquery
jQuery Form jquery-form
jQuery Color jquery-color
jQuery UI Core jquery-ui-core
jQuery UI Tabs jquery-ui-tabs
jQuery UI Sortable jquery-ui-sortable
jQuery Interface interface
jQuery Schedule schedule
jQuery Suggest suggest
ThickBox thickbox
Simple AJAX Code-Kit sack
QuickTags quicktags
ColorPicker colorpicker
Tiny MCE tiny_mce
Prototype Framework prototype
Autosave autosave
WordPress AJAX Response wp-ajax-response
List Manipulation wp-lists
WP Common common
WP Editor editor
WP Editor Functions editor-functions
AJAX Cat ajaxcat
Admin Categories admin-categories
Admin Tags admin-tags
Admin custom fields admin-custom-fields
Password Strength Meter password-strength-meter
Admin Comments admin-comments
Admin Users admin-users
Admin Forms admin-forms
XFN xfn
Upload upload
PostBox postbox
Slug slug
Post post
Page page
Link link
Comment comment
Admin Gallery admin-gallery
Media Upload media-upload
Admin widgets admin-widgets
Word Count word-count
WP Gears wp-gears
Theme Preview theme-preview

Resources

This article is marked as in need of editing. You can help Codex by editing it.