Register & Enqueue Script Generator
Generate wp_enqueue_script() code with dependencies, a cache-busting version, footer loading, conditional context and wp_localize_script data.
<?php
/**
* Enqueues the "my-plugin-frontend" script.
*/
function my_plugin_enqueue_scripts() {
$src = plugins_url( 'assets/js/frontend.js', __FILE__ );
$file = plugin_dir_path( __FILE__ ) . 'assets/js/frontend.js';
// filemtime changes whenever the file does, so browsers never serve a stale copy.
$version = file_exists( $file ) ? filemtime( $file ) : false;
wp_enqueue_script(
'my-plugin-frontend',
$src,
array(),
$version,
array(
'in_footer' => true,
'strategy' => 'defer',
)
);
}
add_action( 'wp_enqueue_scripts', 'my_plugin_enqueue_scripts' );
Output is valid and updates as you type.
Fix the highlighted fields to update the output.
Point at the script file, say where it loads and what it depends on, and the generator writes the wp_enqueue_script() call with a cache-busting version and the right hook.
How to use
- Name the handle. Other code uses it to depend on your script, dequeue it or pass data to it, so prefix it.
- Give the path relative to your plugin or theme root. The generator builds the URL and the filesystem path from it, because the version needs both.
- List dependencies by handle.
jqueryfor jQuery,wp-elementfor React in the block editor. - Leave the version on filemtime unless you have a build step that fingerprints filenames.
- Turn on passing data if the script needs a REST URL or a nonce, and pick a conditional if the file only matters on some pages.
Example
An admin script that needs jQuery and the i18n package, versioned from a constant, with a REST URL and nonce handed to it:
wp_enqueue_script(
'acme-admin',
$src,
array_map( 'trim', explode( ',', 'jquery, wp-i18n' ) ),
$version,
array(
'in_footer' => true,
'strategy' => 'defer',
)
);
wp_localize_script(
'acme-admin',
'acmeAdmin',
array(
'restUrl' => esc_url_raw( rest_url() ),
'nonce' => wp_create_nonce( 'wp_rest' ),
)
);filemtime() is what makes the browser pick up a change: the version string moves whenever the file does, so there is no stale copy to clear.
Pitfalls
- Hardcoding a version string means editing it on every deploy, and forgetting once means users run old code until they clear their cache.
filemtime()on a missing file throws a warning, which is why the generated code checksfile_exists()first.- An unprefixed handle can collide with another plugin. WordPress silently keeps the first registration and ignores yours.
- Enqueueing outside a hook, directly at file load, runs too early and the script never reaches the page.
admin_enqueue_scriptsfires on every admin screen. Without a screen check you ship your file to the whole dashboard.asyncdoes not preserve execution order, so a script with dependencies can run before them. Usedeferunless the file is genuinely standalone.wp_localize_script()must run after the script is registered or enqueued, never before, and it outputs the data as a global.- Block editor assets belong on
enqueue_block_editor_assets, notadmin_enqueue_scripts, or they load on screens with no editor.
Compatibility
wp_enqueue_script() has taken this argument shape since WordPress 2.6. The array( 'in_footer', 'strategy' ) form needs WordPress 6.3 or later; on older versions pass the boolean instead, which the tool writes when the strategy is set to none. Generated code targets PHP 7.0 and up, and the tool runs in your browser.
Frequently asked questions
Register or enqueue?
Where do dependencies come from?
jquery, wp-i18n and wp-element.Why does my script 404?
plugins_url() is given __FILE__. Moving the snippet to a different folder changes the URL it builds.Should everything go in the footer?
defer is what modern pages want.