wp_add_inline_script( string $handle, string $data, string $position = 'after' )

Adds extra code to a registered script.


Description Description

Code will only be added if the script is already in the queue. Accepts a string $data containing the Code. If two or more code blocks are added to the same script $handle, they will be printed in the order they were added, i.e. the latter added code can redeclare the previous.

See also See also


Top ↑

Parameters Parameters

$handle

(string) (Required) Name of the script to add the inline script to.

$data

(string) (Required) String containing the javascript to be added.

$position

(string) (Optional) Whether to add the inline script before the handle or after.

Default value: 'after'


Top ↑

Return Return

(bool) True on success, false on failure.


Top ↑

Source Source

File: wp-includes/functions.wp-scripts.php

function wp_add_inline_script( $handle, $data, $position = 'after' ) {
	_wp_scripts_maybe_doing_it_wrong( __FUNCTION__ );

	if ( false !== stripos( $data, '</script>' ) ) {
		_doing_it_wrong(
			__FUNCTION__,
			sprintf(
				/* translators: 1: <script>, 2: wp_add_inline_script() */
				__( 'Do not pass %1$s tags to %2$s.' ),
				'<code>&lt;script&gt;</code>',
				'<code>wp_add_inline_script()</code>'
			),
			'4.5.0'
		);
		$data = trim( preg_replace( '#<script[^>]*>(.*)</script>#is', '$1', $data ) );
	}

	return wp_scripts()->add_inline_script( $handle, $data, $position );
}

Top ↑

Changelog Changelog

Changelog
Version Description
4.5.0 Introduced.


Top ↑

User Contributed Notes User Contributed Notes

  1. Skip to note 1 content
    Contributed by Clifford Paulick

    The following code can be used to easily add Typekit’s JavaScript to your theme:

    function mytheme_enqueue_typekit() {
       wp_enqueue_script( 'mytheme-typekit', 'https://use.typekit.net/.js', array(), '1.0' );
       wp_add_inline_script( 'mytheme-typekit', 'try{Typekit.load({ async: true });}catch(e){}' );
    }
    add_action( 'wp_enqueue_scripts', 'mytheme_enqueue_typekit' );
    

    Which results in:

    <script type="text/javascript" src="https://use.typekit.net/.js?ver=1.0"></script>
    <script type="text/javascript"> try{Typekit.load({ async: true });}catch(e){} </script>
    

    From https://make.wordpress.org/core/2016/03/08/enhanced-script-loader-in-wordpress-4-5/

  2. Skip to note 2 content
    Contributed by dhinju

    For adding inline script

    function theme_prefix_enqueue_script() {
       wp_enqueue_script( 'main-js', '/main.js', array(), '1.0' );
       wp_add_inline_script( 'main-js', 'alert("hello world");' );
    }
    add_action( 'wp_enqueue_scripts', 'theme_prefix_enqueue_script' );
    

    For jQuery-dependent scripts use this:

    function theme_prefix_enqueue_script() {
       if ( ! wp_script_is( 'jquery', 'done' ) ) {
         wp_enqueue_script( 'jquery' );
       }
       wp_add_inline_script( 'jquery-migrate', 'jQuery(document).ready(function(){});' );
    }
    add_action( 'wp_enqueue_scripts', 'theme_prefix_enqueue_script' );
    

You must log in before being able to contribute a note or feedback.