東京のホームページ制作会社・web制作会社
株式会社シンシエイト

WordPressの管理画面にCSSファイルやJSファイルを読み込む方法

WordPress

WordPressをクライアント向けにカスタマイズする時に、特定の項目を非表示にしたかったり、サイズを変更したかったりということがあります。

これらの対策に管理画面にCSSファイルやJSファイルを読み込む方法を共有します。

やりたいこと

WordPressの管理画面(/wp-admin/*)にCSSファイルとJSファイルを読み込む。

結論

このPHPをfunction.phpなどに追記すれば管理画面にCSSとJSファイルが読み込まれます。コピペでOKという方はコピペでそのまま使ってください。

上記プログラムの解説

4・5行目は、テーマディレクトリからのCSSとJSのファイルパスをそれぞれ変数に代入します。

8・9行目は、CSSとJSそれぞれのURLをつくります。これらのURLをそのまま読み込んでも良いのですが、WordPress管理画面はキャッシュされるのでGETパラメーターでファイルの更新日をつけるとより良いでしょう。

12・13行目は、各ファイルの最終更新日時を取得しています。

16・17行目で、各ファイルの読み込みと、キャッシュ対策としてGETパラメーターで最終更新日時を追加しています。

今回のWordPress開発のポイント

やりたいことはそんなに難しくないのですが、WordPressの管理画面で読み込むファイルはキャッシュが強めです。

ですのでCSSやJSファイルを更新してアップロードしたけれど、サイトには反映されない、などということが頻繁に起こり得ます。

そのためGETパラメータで予め更新日時を送ってあげるとキャッシュされずに便利に使えます。

三上 龍志
この記事を書いた人
三上 龍志
元パンパースのCMモデルがネタの株式会社シンシエイト代表。システムエンジニア出身営業育ち。ビーフジャーキー作りが趣味。webが大好きな2児の父。
関連する記事
ワードプレスで最初に設定すべき5つの初期設定 & その他の設定まとめ
WordPress
ワードプレスのテーマとは?デザインテンプレートを変更する2つの方法
WordPress
ワードプレスの投稿者アイコンを表示する「Gravatar」にアバターアイコンを登録しよう
WordPress
WordPressとは?ワードプレスのメリットとデメリットを徹底解説!
WordPress
WordPressのマルチサイト化は超カンタン!初心者でもラクラク設置する5ステップ
WordPress
WordPress管理画面のエディタ内だけにCSSを適用する方法
WordPress
NO IMAGE
【WPエラー】Warning: dynamic sitemap generation must have parmalinks enabled.
WordPress
【WP】W3Cのマークアップバリデーションエラーを解決する方法
WordPress
NO IMAGE
WPのiPhoneアプリとウェブブラウザで出来る・出来ない機能比較
WordPress
ワードプレスの iPhone アプリ初期設定方法
WordPress
株式会社シンシエイト ブログ バックエンド WordPress WordPressの管理画面にCSSファイルやJSファイルを読み込む方法

web制作とマーケティングで
貴社の経営課題を解決します

web制作でのブランディングや、コンテンツマーケティング・SEO・ネット広告を中心としたウェブマーケティングを通じて、企業の事業を加速させるご提案をしています。

お電話でのお問い合わせはこちら

現在リモートワーク推進中のため、お電話が繋がりにくくなっております。
受付時間は平日10:00〜18:00です。セールス目的のお電話はご遠慮ください。