「wordpressの自作テーマでプラグインのJSやCSSが効かない」原因は初歩的な<?php wp_head();?>の記入漏れというミスだった!

wordpressで自作テーマを作るのはけっこう楽しいですよね。テーマを作るのは今回で2回目なのですが、どうも今回つくったテーマで「うまくプラグインのcssが反映されないぞ・・・」と悩んでいました。前回テーマを作ってからだいぶ時間もたっていて、いったい原因がなんなのか検討もつかず、すっかりハマってしまったので記事に残します。

<?php wp_head();?><php wp_footer(); ?>の設定は大丈夫?

そうです、自作テーマの場合、ヘッダーとフッターに<?php wp_head();?><php wp_footer(); ?>を入れなければなりません。

wp_head
すっかり設定を忘れていました、とほほ

これはheaderやfooterにタグを読み込むために設定しなければならないコードなので、これが設定されていないと、プラグインが満足に動きません。

設定は簡単でheader.phpとfooter.phpに下記の記述を加えるだけです。

header.php
<?php wp_head();?>
</head>

</head>の直前に入れます。

footer.php
<?php wp_footer();?>
</body>

こちらは</body>の直前に入れます。

<?php wp_head();?>を記述したらツールバーの空白スペース削除もお忘れなく!

<?php wp_head();?>を記述すると管理バーの空白スペースがページの上部に表示されています。こちらの削除もあわせておわすれなく!

function.php
add_filter( 'show_admin_bar', '__return_false' );

こちらの件はLIGさんのブログに詳細が記載してあります。

まとめ

自作テーマ作りは楽しいのですが、こういった基本的なところでつまづいて何時間も時間を浪費することもあります。産休中に職場復帰のトレーニングとして自作テーマを構築したのですが、久しぶりのコーディングに、忘れていることや基本的なところでつまづくことがけっこうありました。

間違えて、調べて試すうちに少しづつ仕事の勘を取り戻して行くのかな?と思いました。ぜひ自作テーマとプラグインの設定でつまづいた時、このような項目もチェックしてみてくださいね!

コメント

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