web-dev-qa-db-ja.com

特定のWordPressページのみのJavaScriptをエンキューする方法は？

私はWordPressを使い始めたばかりですが、最初にこれを検索してみたところ、いくつか関連する回答が見つかりましたが、どれも完全には理解できませんでした。数行の具体的な指示に感謝します。 WordPressページにいくつかの関数を含むスクリプトがあり、次にそれらを使用する別の短いスクリプトがあります。他のいくつかのページでこれらの関数を再利用したいので、次のようにします。

  • 別のjsファイルを作成するにはどうすればよいですか？どこに置くの？ wp-includes/js内？

  • それらをページに公開するにはどうすればよいですか（register.enqueを介してfunctions.phpに配置しますか？パスを正確に指定するにはどうすればよいですか？これを行う別の方法はありますか？

  • すべてのページに公開するのではなく、特定のいくつかのページに公開する方法はありますか？

  • 使用中のページで、これらの関数をロードして呼び出すにはどうすればよいですか？

以下は私が今持っているコードの構造です。ありがとう！ヨアフ

<script> 
// an example for the  functions i want to reuse function
foo(x,y) { 
    ... 
    do stuff 
    return z; 
} 
function goo() { 
// <![CDATA[ ..
     do stuff ... 
 // ]]> 
} 
</script> 

<script> 
// an example for the  real
page val x = "something"; 
val y = "other"; 
var message = foo(x, y);

// this will add some  content to the page goo(); 
// this adds some more 
document.write(message); 
</script>
functionsjavascriptwp-enqueue-script
1
Yoav Ossia

はい、別のJSファイルを作成してプラグインまたはテーマフォルダーに保存します。これを_example.js_と呼びます。このファイルには、複数のページで実行する必要があるすべての一般的な関数が含まれている必要があります。ページ固有の関数は別のファイルに移動する必要があります。
_example.js_でコードを記述した後、それをWordPressに含める必要があります。これを行うには、この関数を使用する必要があります

_function my_scripts() {
    // Page ID, title, slug, or array of such.
    // e.g. is_page('My page title') - page title
    // e.g. is_page(2) - page id 
    // e.g. is_page('my-page-title') - page slug
    // e.g. is_page( array( 'page1', 'page1')) - in this example an array of page slugs.
    // Check out the references for more on this function.
    if( is_page( array( 'about-us', 'contact', 'management' ) ){
        wp_enqueue_script( 'script-name', 'path/to/example.js', array(), '1.0.0', true );
    }
}
add_action( 'wp_enqueue_scripts', 'my_scripts' );
_


この関数は_functions.php_に配置できます。
ファイルがテーマディレクトリにある場合は、これを使用します

_wp_enqueue_script( 'script-name', get_template_directory_uri() . '/example.js', array(), '1.0.0', true );
_


ヒント：
_example.js_がプラグインフォルダーにある場合、plugin_dir_url( __FILE__ )の代わりにget_template_directory_uri()を使用する必要があります。ここで___FILE___はPHP現在のファイルパスの定数。

変数を設定し、JSファイルのさまざまなページでその値を使用するには、この関数が必要です。

_wp_localize_script('script-name', 'array_name', array(
        'variable_name' => 'Variable value'
    )
);
_

注：
_wp_localize_script_スクリプトは、wp_register_script（）またはwp_enqueue_script（）を使用して登録された後で呼び出す必要があります。

参照：

4
devkabiir