万が一、当サイトで重大な問題を発見した際などは、フォーラムや WordSlack #docs チャンネルでお知らせください。</p>
関数リファレンス/wp localize script
このページ「関数リファレンス/wp localize script」は未翻訳です。和訳や日本語情報を加筆してくださる協力者を求めています。
概要
JavaScriptの変数のデータと登録スクリプトをローカライズします。
This lets you offer properly localized translations of any strings used in your script. This is necessary because WordPress currently only offers a localization API in PHP /en, not directly in JavaScript (but see ticket #20491).
Though localization is the primary use, it can be used to make any data available to your script that you can normally only get from the server side of WordPress.
使い方
<?php wp_localize_script( $handle, $name, $data ); ?>
パラメータ
- $handle
- （string） （必須） The registered script handle you are attaching the data for.
- 初期値： なし
- $name
- （string） （必須） The name of the variable which will contain the data. Note that this should be unique to both the script and to the plugin or theme. Thus, the value here should be properly prefixed with the slug or another unique value, to prevent conflicts. However, as this is a JavaScript object name, it cannot contain dashes. Use underscores or camelCasing.
- 初期値： なし
- $data
- （array） （必須） The data itself. The data can be either a single- or multi- (as of 3.3) dimensional array. Like json_encode(), the data will be a JavaScript object if the array is an associate array (a map), otherwise the array will be a JavaScript array.
- 初期値： なし
用例
<?php // Register the script first. wp_register_script( 'some_handle', 'path/to/myscript.js' ); // Now we can localize the script with our data. $translation_array = array( 'some_string' => __( 'Some string to translate' ), 'a_value' => '10' ); wp_localize_script( 'some_handle', 'object_name', $translation_array ); // The script can be enqueued now or later. wp_enqueue_script( 'some_handle' );
You can access the variables in JavaScript as follows:
<script>
alert( object_name.some_string) ; // alerts 'Some string to translate'
</script>
注: The data in the resulting JavaScript call will be passed as text (see ticket #25280). If you are trying to pass integers you will need to call the JavaScript parseInt() function.
<script>
// Call a function that needs an int.
FinalZoom = map.getBoundsZoomLevel( bounds ) - parseInt( data.a_value, 10 );
</script>
注
重要！ wp_localize_script() MUST be called after the script it's being attached to has been registered using wp_register_script() or wp_enqueue_script().
Furthermore, the actual output of the JavaScript <script> tag containing your localization variable occurs at the time that the enqueued script is printed (output/included on the page). This has some significant repercussions if you enqueue your script as you should using the appropriate actions (wp_enqueue_scripts and admin_enqueue_scripts), but wish to localize later using data that is not available at enqueue time.
In this case, consider enqueueing your script with the in_footer argument set to true, to delay the printing of your script include until much later in the page build (ie: wp_enqueue_script( $slug, $URL, $deps, $ver, true ); ). The last chance to localize your script would then be on the 'wp_print_footer_scripts' hook.
ソースファイル
wp_localize_script() は wp-includes/functions.wp-scripts.phpにあります。
外部リソース
- http://qiita.com/kouichi_hoshi/items/89fed246fee9947678ed wp_localize_script() テーマファイルのURLなどをjsファイルに渡す
関連
- エンキュー関数:
- スクリプト:wp_register_script(),wp_deregister_script(), wp_enqueue_script(), wp_dequeue_script() /en, wp_script_is() /en, wp_localize_script(), wp_enqueue_media()
- スタイル: wp_register_style(),wp_deregister_style() /en,wp_enqueue_style(),wp_dequeue_style(), wp_style_is() /en
- エンキューアクション:
- フロントエンド: wp_enqueue_scripts /en, wp_print_scripts /en, wp_print_styles /en
- 管理画面: admin_enqueue_scripts /en, admin_print_scripts / en, admin_print_styles /en
- ログイン: login_enqueue_scripts /en
最新英語版： WordPress Codex » Function_Reference/wp_localize_script （最新版との差分）
