WordPressの管理画面で独自のCSSやJavaScriptを読み込む方法

WordPressの管理画面で独自のCSSやJavaScriptを読み込む方法をご紹介いたします。

管理画面に独自のCSSやJavaScriptを読み込むことで、より柔軟なカスタマイズが可能になります。

WordPressの管理画面で独自のCSSやJavaScriptを読み込む方法

管理画面で独自のCSSやJavaScriptを読み込むには、適用しているテーマのfunctions.phpに以下のコードを追加します。

function add_admin_css_js() {
  wp_enqueue_style( 'admin_style', get_template_directory_uri() . '/css/admin.css' );
  wp_enqueue_script( 'admin_script', get_template_directory_uri() . '/js/admin.js', array(), '1.0.0', true );
  wp_enqueue_script( 'admin_script_jq', get_template_directory_uri() . '/js/admin.js', array('jquery'), '1.0.0', true ); //jQueryの場合
}
add_action( 'admin_enqueue_scripts', 'add_admin_css_js' );

テーマフォルダ内の/css/admin.cssと/js/admin.jsが管理画面で読み込まれるようになります。

JavaScriptの読み込みは、スクリプトがjQueryの場合は「array(‘jquery’)」で依存スクリプトを指定してあげます。

あとがき

管理画面をカスタマイズしたい時は、ぜひ参考にしていただければと思います。