WordPress

【WordPress/PHP】wp_enqueue_style/wp_enqueue_scriptでファイルが読み込まれない時の原因と対処法

本記事では、WordPressでwp_enqueue_style/wp_enqueue_scriptでファイルが読み込まれない時の原因と対処法について解説しています。

WordPressの学習におすすめ参考書
1冊ですべて身につくWordPress入門講座

本書情報
著者Mana
発売日2022/3/22
ページ数344ページ
Kindle版
レビュー
(Amazon)
(217件)

【中・上級者向け】オリジナルテーマの作り方が学べるおすすめ参考書
WordPressオリジナルテーマ制作入門

本書情報
著者清水 由規 / 清水 久美子 / 鈴木 力哉 / 西岡 由美
発売日2022/1/13
ページ数416ページ
Kindle版
レビュー
(Amazon)
(53件)
先輩くん
先輩くん
Amazon Kindle Unlimitedに登録すると、月額980円で読み放題だからオススメだよ!
後輩ちゃん
後輩ちゃん
初回30日間は無料だから、まだ登録したことのない人はぜひ試してみてね!

パスの間違い

ファイルが読み込まれない時の原因の1つ目は、読み込ませたいファイルまでのパスが間違えていることです。

wp_enqueue_style/wp_enqueue_scriptの関数では第二引数に読み込みたいファイルが配置されているパスを指定します。CDNなどの外部ファイルを読み込む場合は絶対パスなのでパス間違いは起きないと思われますが、テーマ配下に配置したファイルを読み込ませたい場合は注意が必要です。

テーマ配下に配置したファイルを読み込ませたい場合は「get_theme_file_uri」や「get_template_directory_uri」などの関数を使用しテーマまでの絶対パスを取得しそれにテーマ配下の読み込ませたいファイルまでのパスを組み合わせます。

例えば、テーマ配下の「assets/css/style.css」を読み込ませたい場合は以下のように記述します。

wp_enqueue_style('my-style', get_theme_file_uri('/assets/css/style.css'));
先輩くん

wp_enqueue_style/wp_enqueue_scriptの使い方がよく分からないという方は、下記の記事で詳しく解説しているのでご参考ください。

wp_headとwp_footerを追記していない

ファイルが読み込まれない時の原因の2つ目は、wp_headとwp_footerを追記していないことです。

wp_enqueue_style/wp_enqueue_scriptを正しく記述していても、wp_headやwp_footerを追記していないと出力がされません。

wp_headは<head>タグ内に、wp_footerは</body>タグの直前に記述します。

<head>
    <?php wp_head(); ?>
</head>
<?php wp_footer(); ?>
</body>

ブログランキング・にほんブログ村へ PVアクセスランキング にほんブログ村