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);

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


カテゴリー: WordPress   パーマリンク

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です