こんにちは、Ryohei(@ityryohei)です!

本記事では、WordPressでカスタム投稿の投稿を編集する管理画面に独自のスクリプトを読み込む方法をご紹介しています。

WordPressの管理画面で特定のカスタム投稿の投稿画面にスクリプトを読み込みたいな。良い方法ないかな?

上記の疑問にお答えします。

では、解説していきます。

カスタム投稿の管理画面にスクリプトを読み込む方法

WordPressで管理画面にスクリプトを読み込むには下記のアクションフックを使用します。

  • admin_print_scripts(head要素内に読み込む
  • admin_print_footer_scripts(body要素を閉じる直前に読み込む

上記アクションフックは、管理画面内のどのページで実行するかをファイル名を使って指定することができます。

  • admin_print_scripts-filename.php
  • admin_print_footer_scripts-filename.php

今回は投稿を新規作成する画面と、投稿を編集する画面でスクリプトを読み込みたいので、ファイル名には下記を指定します。

  • post.php
  • post-new.php

これらを使用して、管理画面でカスタム投稿の投稿画面に独自のスクリプトを読み込んでみます。

head要素内にスクリプトを読み込む

head要素内にスクリプトを読み込みます。ライブラリの追加やページの読み込みが始まって最初の方に実行したいスクリプトを読み込む際に有効です。カスタム投稿の判定にはget_post_type()を使用します。

PHP

//wp-content/themes/functions.php
function my_admin_script(){
    //投稿タイプ指定(下記ではnews) 
    if ('news' === get_post_type()){

        echo "ここに実行するスクリプトを記述する";

    }
}
add_action("admin_print_scripts-post.php", 'my_admin_script');
add_action("admin_print_scripts-post-new.php", 'my_admin_script');

以上でhead要素内に任意のスクリプトを読み込むことができます。

body要素を閉じる直前にスクリプトを読み込む

body要素を閉じる直前にスクリプトを読み込みます。スクリプトはページの読み込み完了後に実行させたい場合が多いため、基本的にはこちらのアクションフックを使用することになるかと思います。カスタム投稿の判定は前項と同じくget_post_type()を使用しています。

PHP

//wp-content/themes/functions.php
function my_admin_script(){
    //投稿タイプ指定(下記ではnews) 
    if ('news' === get_post_type()){

        echo "ここに実行するスクリプトを記述する";

    }
}
add_action("admin_print_footer_scripts-post.php", 'my_admin_script');
add_action("admin_print_footer_scripts-post-new.php", 'my_admin_script');

以上でbody要素を閉じる直前にスクリプトを読み込むことができます。

最後に

WordPressのアクションフックは、一連の処理の流れの中でタイミングを指定して任意の処理を追加することができる便利な機能です。タイミングも短い間隔で設けられているので、このタイミングでこの処理を実行したい!などがあれば調べながら処理を作ってみてくださいね。

以上、WordPressでカスタム投稿の管理画面にスクリプトを読み込む方法のご紹介でした!

この記事を書いた人

Ryohei

Webエンジニア / ブロガー

福岡のWeb制作会社に務めるWebエンジニアです。エンジニア歴は10年程で、好きな言語はPHPとJavaScriptです。本サイトは私がインプットしたWebに関する知識を整理し、共有することを目的に2015年から運営しています。Webに関するご相談があれば気軽にお問い合わせください。