wp_add_inline_script() WP 4.5.0
Добавляет дополнительный javascript код к зарегистрированному скрипту.
JS добавляется прямо в html документ, после основного (указанного) скрипта. Можно указать чтобы до скрипта.
Код скрипта указывается в параметре $data
. Если на один обработчик (название) добавлено несколько скриптов, то ни будут выведены в порядке их добавления, в едином блоке <script>.
Использовать функцию нужно после того, как основной скрипт добавлен в очередь на вывод, но еще не был выведен на экран. Т.е. если скрипт добавлен и уже выведен на экран использование функция ничего не выведет.
Аналогичная функция для стилей: wp_add_inline_style()
Хуков нет.
Возвращает
True/false. True если удалось добавить код скрипта, false в противном случае.
Использование
wp_add_inline_script( $handle, $data, $position );
- $handle(строка) (обязательный)
- Название (ID) скрипта к которому будут добавлен дополнительный блок скрипта.
- $data(строка) (обязательный)
- JS код в виде строки. Открывающий/закрывающий <script> добавляется автоматически.
- $position(строка)
- Куда добавить код: до (before) или после (after) указанного в
$handle
скрипта.
По умолчанию: 'after'
Примеры
#1 Демонстрация работы
Подключим JS код после файла JS:
add_action('wp_enqueue_scripts', function(){ wp_enqueue_script('my_scripts', get_stylesheet_directory_uri() .'/my_scripts.js' ); // добавим произвольный код wp_add_inline_script('my_scripts', 'alert("Привет!");'); }); /* Получим в HTML коде <script type='text/javascript' src='http://example.com/wp-content/themes/mytheme/my_scripts.js'></script> <script type='text/javascript'> alert("Привет!"); </script> */
#2 Произвольный код JS перед файлом
Допустим у нас уже подключен файл скрипта my_scripts.js
с идентификатором my_scripts
. И нам нужно дополнить его произвольным кодом. К примеру для него нужно указать глобальные переменные: color1 и color2:
add_action( 'wp_enqueue_scripts', function(){ wp_enqueue_script( 'my_scripts', get_stylesheet_directory_uri() .'/my_scripts.js' ); // добавим произвольный код wp_add_inline_script( 'my_scripts', 'var color1 = "red"; var color2 = "blue";', 'before' ); }); /* Получим в HTML коде <script type='text/javascript'> var color1 = "red"; var color2 = "blue"; </script> <script type='text/javascript' src='http://example.com/wp-content/themes/mytheme/my_scripts.js'></script> */
#3 Несколько вызовов wp_add_inline_script()
add_action('wp_enqueue_scripts', function(){ wp_enqueue_script('my_scripts', get_stylesheet_directory_uri() .'/my_scripts.js' ); // добавим произвольный код wp_add_inline_script('my_scripts', 'var color1 = "red"; var color2 = "blue";' ); wp_add_inline_script('my_scripts', 'var color3 = "#fff"; var color3 = "#000";' ); }); /* Получим в HTML коде <script type='text/javascript' src='http://example.com/wp-content/themes/mytheme/my_scripts.js'></script> <script type='text/javascript'> var color1 = "red"; var color2 = "blue"; var color3 = "#fff"; var color3 = "#000"; </script> */
Заметки
- Смотрите: WP_Scripts::add_inline_script()
Список изменений
С версии 4.5.0 | Введена. |
Код wp_add_inline_script() wp add inline script WP 5.6
function wp_add_inline_script( $handle, $data, $position = 'after' ) {
_wp_scripts_maybe_doing_it_wrong( __FUNCTION__, $handle );
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><script></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 );
}