wp_add_inline_script()


WordPress関数wp_add_inline_script()は、登録済みのJavaScriptファイルにインラインスクリプトを追加するために使用されます。

構文

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

引数の説明:

  • $handle (string) — インラインスクリプトを追加するターゲットとなる登録済みスクリプトのハンドル。
  • $data (string) — インラインスクリプトの内容。
  • $position (string) — スクリプトを追加する位置。「before」または「after」を指定可能 (デフォルト: ‘after’)。

例1: 基本的なインラインスクリプトの追加

登録済みのスクリプトの後にインラインスクリプトを追加します。

wp_add_inline_script( 'jquery', 'console.log("Hello, World!");' );

例2: スクリプトを前に追加

スクリプトの前にインラインスクリプトを追加します。

wp_add_inline_script( 'jquery', 'var example = true;', 'before' );

例3: 複数行スクリプトの追加

複数行のスクリプトをインラインで追加します。

wp_add_inline_script( 'jquery', 'var firstVar = "hello"; var secondVar = "world"; console.log(firstVar + " " + secondVar);' );

例4: 条件付きスクリプトの追加

条件に基づいてスクリプトを追加します。

if ( is_page( 'contact' ) ) {
    wp_add_inline_script( 'contact-script', 'console.log("Contact page loaded");' );
}

例5: グローバル変数の定義

スクリプト内で使用するグローバル変数を定義します。

wp_add_inline_script( 'custom-script', 'var siteUrl = "' . site_url() . '";' );

注意点

  • インラインスクリプトを安全に処理するため、必要に応じてwp_json_encode()を使用してください。
  • 登録されていないスクリプトハンドルに対してこの関数を使用すると、スクリプトは出力されません。

関連機能：