これまでの管理画面の作りは、ほぼphpのみで実装してきました。
次にこの管理画面にjavascirpt(jquery)を動作させるように設定してみます。
まず、プラグインフォルダの中に、jsファイルを設置する為のディレクトリを作成します。
/ワードプレス設置ディレクトリ/wp-content/plugins/SamplePlugin1
上記のディレクトリに対し、jsディレクトリを作成します。
/ワードプレス設置ディレクトリ/wp-content/plugins/SamplePlugin1/js/
次に、そのディレクトリ内に、javascript用のファイルを設置します。
/ワードプレス設置ディレクトリ/wp-content/plugins/SamplePlugin1/js/sample1_script.js
jsの中は、jqueryが使用できるので、以下のようなサンプルコードを書きます。
(function($){ alert("hello jquery !"); })(jQuery);
次に、プラグイン本体のphpのコンストラクタの中に、以下の読み込み命令文を書きます。
wp_register_script('sample1js', plugins_url( './js/sample1_script.js', __FILE__ )); wp_enqueue_script('sample1js');
こうすることで、プラグインの画面にアクセスした時にjsがロードされます。
例では、アラートを表示するだけのシンプルなjsですが、画面にアクセスすると以下のようになります。
アラート表示だけのプログラムなので、あまり意味がないですが、jsが動作することを確認できました。