WordPressの自作プラグイン設定画面にjavascriptコードを入れる方法

本ページにはプロモーションが含まれています。
プラグイン

正確にいうと、

WordPressの自作プラグイン設定画面のhead部分に何か挿入する方法、です。

何がやりたかったのかというと

自作したプラグインの設定画面(設定–>プラグインメニュー)にて、javascriptでちょっとした動きをつけたかったので、プラグイン設定ページが表示された時だけ、head部分にscriptタグで出力したかった、という話です。

結論

こんな感じで記述したら動きました。

function MY_FUNCTION{
 /*ここにscriptタグをechoする*/
 echo'<script>hogehoge</script>';
}
add_action('admin_head-settings_page_MYPLUGINFOLDERNAME', 'MY_FUNCTION');

このフック名「admin_head-settings_page_MYPLUGINFOLDERNAME」がポイントです。

MYPLUGINFOLDERNAMEのところを、自作プラグインのフォルダ名に書き換えてください。

ハマったところ

フックをどうすればいのか分からなかったです。

adminのページのheadに出力する場合は、admin_head-フックを使います。
例えば、投稿編集ページに出力するなら、こう。

add_action('admin_head-post.php', 'MY_FUNCTION');

で、プラグインの設定ページに出力するにはフックはどうしたらいいんだ??、とすこしググりましたところ、

こちらのページに助けられました。

admin_headを特定のページでのみ使用するにはhook_suffixを知るべし | Firegoby

フック名を確認するためのコードが載ってまして、

add_action("admin_head", 'suffix2console');
function suffix2console() {
    global $hook_suffix;
    if (is_user_logged_in()) {
        $str = "<script type=\"text/javascript\">console.log('%s')</script>";
        printf($str, $hook_suffix);
    }   
}

(1)これをプラグインファイル(php)に書く
(2)プラグイン設定ページを開く
(3)ブラウザのデバッグコンソールを開く

と見事、フック名が表示されていました。

コメント

タイトルとURLをコピーしました