WordPressプラグイン開発-管理画面でJavaScriptをロードする

通常のHTMLであれば、JavaScriptファイルは以下の様にしてページ内に読み込めます。

<script type="text/javascript" src="xxxx.js"></script>

WordPressの管理ページを作っている時はダメでした。
次の様にしてやる必要があります。

WordPressの関数でJavaScriptをロードする

<?php 
 wp_register_script( 'xxxx-script-name', plugins_url( '../../js/xxxx_my_script.js', __FILE__ ) );
 wp_enqueue_script( 'xxxx-script-name' );
?>

wp_register_script が JavaScriptファイルの宣言だと思って下さい。

plugins_url は JavaScriptの置かれているパスで、この実装をしようとしているファイルからJavaScriptまでの相対パスで指定してやります。

次のwp_enqueue_scriptで実際にページ中に読み込まれます。この記事では’xxxx-script-name’という名前で定義し、そして読み込みを行っています。

ちなみに wp_enqueue_script(‘jquery’); で WordPressに付属の jQueryが読み込めるそうです。以下の様にラップしないとjQueryでよく使う $(‘#sample’) ･･･ が使えないということです。

(function($){ ･･･ここにコードを書く･･･ })(jQuery);

これでいろいろできそうです。