WP_LOCALIZE_SCRIPT(): Локализация JavaScript-скрипта │ WP 2.2.0

## Функция WP_LOCALIZE_SCRIPT() │ WP 2.2.0

Функция wp_localize_script() используется для локализации (перевода) JavaScript-скрипта. Она работает только в том ��лучае, если скрипт уже был добавлен.

Функция принимает ассоциативный массив $l10n и создает объект JavaScript:

```javascript
"$object_name" = { ключ: значение, ключ: значение, ... }

Важно!

Эта функция может использоваться только после того, как скрипт был зарегистрирован.

Возвращаемое значение

Функция возвращает true, если скрипт успешно локализован, и false в противном случае.

Использование

wp_localize_script( $handle, $object_name, $l10n );

• $handle (строка) (обязательно) — Игровая метка для скрипта, к которому будут добавлены данные.
• $object_name (строка) (обязательно) — Имя для объекта JavaScript. Это должно быть корректное имя переменной в JS. Пример: /[a-zA-Z0-9_]+/.
• $l10n (массив) (обязательно) — Данные, которые вы передаете. Это может быть как одномерный, так и многомерный массив.

Примеры использования

Пример 1: Локализация строк

Не рекомендуется использовать wp_localize_script() для передачи данных. Лучше использовать wp_add_inline_script() для передачи данных, таких как параметры.

Неправильный способ:

wp_enqueue_script( 'my-script', 'https://url-to/my-script.js' );

wp_localize_script( 'my-script', 'myScriptData', [
    'ajax_url'  => admin_url( 'admin-ajax.php' ),
    'param_one' => 'некоторое значение',
    'param_two' => 25,
] );

Правильный способ:

wp_enqueue_script( 'my-script', 'https://url-to/my-script.js' );

$js = 'window.myScriptData = ' . wp_json_encode( [
    'ajax_url'  => admin_url( 'admin-ajax.php' ),
    'param_one' => 'некоторое значение',
    'param_two' => 25,
] );

wp_add_inline_script( 'my-script', $js, 'before' );

Важно добавить 'before' как третий параметр.

Теперь в JavaScript-скрипте вы можете получить доступ к данным так:

console.log( myScriptData.ajax_url );  // "https://пример.com/wp-admin/admin-ajax.php"
console.log( myScriptData.param_one );  // "некоторое значение"
console.log( myScriptData.param_two );  // 25

Пример 2: Вставка глобальных данных

Это пример вставки глобальных данных JavaScript перед JS-скриптом (в данном случае, скрипт - jQuery). Используйте этот код в файле functions.php:

add_action( 'wp_enqueue_scripts', 'имя_функции', 99 );

function имя_функции() {
    wp_localize_script( 'jquery', 'object_name', array(
        'some_string' => __( 'Некоторый текст для перевода' ),
        'some_num' => '10'
    ) );
}

В результате мы получим в заголовке сайта:

Пример 3: Определение файла для обработки AJAX-запросов

Функ��ия wp_add_inline_script() была введена в WP v4.5 и теперь является рекомендованным способом. wp_localize_script() следует использовать только для локализации строк.

Добавим скрипт и затем глобальные данные к нему. Здесь мы добавляем JavaScript-файл с AJAX-запросом. Файл использует переменную MyAjax.ajaxurl как URL для выполнения AJAX-запроса. Мы определим этот URL через wp_localize_script():

add_action( 'wp_enqueue_scripts', 'имя_функции' );

function имя_функции() {
    wp_enqueue_script( 'my-ajax', get_template_directory_uri() . '/js/custom_script.js' );
    wp_localize_script( 'my-ajax', 'MyAjax', [ 'ajaxurl' => admin_url( 'admin-ajax.php' ) ] );
}

Мы получим:

Доступ к переменным в JavaScript осуществляется следующим образом (в данном примере 2):

// в файле custom_script.js мы можем использовать переменную: MyAjax.ajaxurl
alert( MyAjax.ajaxurl ); // выводит http://пример.com/wp-admin/admin-ajax.php

Пример 4: Множественные вызовы функции

Обратите внимание, что вызов этой функции несколько раз за одну сессию с тем же именем объекта перезапишет предыдущие значения:

wp_localize_script( 'some_handle', 'object_name', $value1 );
... // код исполнен снова
wp_localize_script( 'some_handle', 'object_name', $value2 ); 
// object_name теперь установлен на $value2.

Если вам нужно иметь несколько наборов данных, связанных с одним и тем же скриптом (handle), то вам нужно переименовать ваш объект.

wp_localize_script( 'some_handle', 'object_name1', $value1 );
... // код исполнен снова
wp_localize_script( 'some_handle', 'object_name2', $value2 );

Примечания

• Смотрите: WP_Scripts::localize()

  function wp_localize_script( $handle, $object_name, $l10n ) {
  $wp_scripts = wp_scripts();
  return $wp_scripts->localize( $handle, $object_name, $l10n );
  }

Связанные функции

• wp_add_inline_script()
• wp_dequeue_script()
• wp_deregister_script()
• wp_enqueue_media()
• wp_enqueue_script()
• wp_register_script()
• wp_script_add_data()
• wp_script_is()