プラグインでJavaScriptをエンキューする方法

今回は、プラグインフォルダーにJavaScriptファイルを含めることに取り組んでいます。

テーマディレクトリからウィジェットファイルを転送してプラグインを作成しようとしています。ウィジェットファイルをコピーしましたが、そのウィジェットファイルはJavaScriptファイルに依存していたため、プラグインディレクトリに/ js /フォルダーを作成しました。このファイルがホストされている場所「jquery.repeatable.js」

このコードを使用しましたが、jsファイルが含まれていないようです-

function Zumper_widget_enqueue_script()
{   
    wp_enqueue_script( 'my_custom_script', plugin_dir_url( __FILE__ ) . 'js/jquery.repeatable.js' );
}
add_action('admin_enqueue_scripts', 'Zumper_widget_enqueue_script');

私はフォーラムでこれを検索しました-https : //stackoverflow.com/questions/31489615/call-a-js-file-from-a-plugin-directory

しかし、まだこれは役に立ちませんでした。

質問をまとめ直します。プラグインディレクトリで、このフォルダーの下にjsファイルがあります-/ js /

正しいプロセスとは何かを含めたいのですが、何か登録する必要がありますか？

この部分に何か問題があり'admin_enqueue_scripts'ますか？

コードは正しいように見えますが、スクリプトをadmin_enqueue_scripts実行中のキューに登録しているため、管理領域でのみスクリプトがロードされます。

フロントエンドでスクリプトをロードするには、wp_enqueue_scriptsアクションを使用します（wp_enqueue_script()関数とは異なります）：

function Zumper_widget_enqueue_script() {   
    wp_enqueue_script( 'my_custom_script', plugin_dir_url( __FILE__ ) . 'js/jquery.repeatable.js' );
}
add_action('wp_enqueue_scripts', 'Zumper_widget_enqueue_script');

また、そのスクリプトはjQueryに依存しているようです。そのため、dependencieまたはスクリプトをjQueryの前にロードできて、動作しないことを宣言する必要があります。また、スクリプトのバージョンを宣言することを強くお勧めします。このようにして、スクリプトを新しいバージョンに更新すると、ブラウザは再度スクリプトをダウンロードし、キャッシュにあるコピーを破棄します。

たとえば、スクリプトのバージョンが1.0の場合：

function Zumper_widget_enqueue_script() {   
    wp_enqueue_script( 'my_custom_script', plugin_dir_url( __FILE__ ) . 'js/jquery.repeatable.js', array('jquery'), '1.0' );
}
add_action('wp_enqueue_scripts', 'Zumper_widget_enqueue_script');

管理領域にロードする場合：

function Zumper_widget_enqueue_script() {   
    wp_enqueue_script( 'my_custom_script', plugin_dir_url( __FILE__ ) . 'js/jquery.repeatable.js', array('jquery'), '1.0' );
}
add_action('admin_enqueue_scripts', 'Zumper_widget_enqueue_script');

更新しました：

代わりにこのコードを使用してください

function Zumper_widget_enqueue_script()
{   
    wp_enqueue_script( 'my_custom_script', plugin_dir_url( __FILE__ ) . 'js/jquery.repeatable.js', array('jquery'), '1.0.0', false );
}
add_action('admin_enqueue_scripts', 'Zumper_widget_enqueue_script');

3番目のパラメーターは依存関係を宣言し、4番目のパラメーターはバージョンを定義します。

の5番目のパラメーターをwp_enqueue_script()に設定しますtrue。つまり、このファイルはフッターに読み込まれます。

通常、plugins_url（）メソッドを使用してエンキューを実現します。

function Zumper_widget_enqueue_script()
{   
    wp_enqueue_script( 'my_custom_script', plugins_url('js/jquery.repeatable.js', __FILE__ ), '1.0.0', false );
}
add_action('admin_enqueue_scripts', 'Zumper_widget_enqueue_script');