ミニマリストアローンのブログ

【WordPress】CSSがどうしても反映されない場合【究極の対処法】

BLOG

CSSが反映されなくてキレそうなブロガー「WordPress(ワードプレス)でCSSをカスタマイズしたんだけど反映されてない…?うーん、、、いくら更新してもダメだ…。これじゃ気になって記事の執筆に集中できないよ…。」

こういった悩みに答えていきます。

WordPressでカスタマイズしたCSSが反映されない場合は、主にキャッシュが残っていることが原因であると考えられます。しかし、いくらキャッシュを削除しても、中々デザインが反映されない、、、といった場合があるかもしれません。

本記事では、そのような事態に陥ったときの対処法を教えます。

スポンサードサーチ

【WordPress】CSSがどうしても反映されない場合【究極の対処法】

【WordPress】CSSがどうしても反映されない場合【究極の対処法】
先ほども言ったとおりで、原因は主に「キャッシュ」が悪さをしていることです。

キャッシュとは、一度開いたページをブラウザが保持していて、再度ページに訪れたときに、サクサク表示してくれる仕組みのことです。

一見便利な仕組みですが、それが裏目に出てしまい、ブラウザが古いCSSを読み込みにいってしまうことがあるんです。
管理画面でカスタマイズしたとしても、ブラウザ上では反映されないといった困ったことが起きてしまうわけですね。

そんな時は、次の方法で対処していきます。

header.phpに、少し手を加える

header.php<head>内にある、一部ソースコードを置き換えます。

修正前

<link rel="stylesheet" href="<?php echo get_template_directory_uri(); ?>/style.css" type="text/css"/>

修正後

<link rel="stylesheet" href="<?php bloginfo('stylesheet_url'); echo '?' . filemtime( get_stylesheet_directory() . '/style.css'); ?>" type="text/css" />

このソースコードに置き換えることにより、キャッシュが保持している古いCSSが読み込まれることを防ぎます。

つまり、「最新のCSSファイルを読み込みにいってね!」と指定するわけです。
これで反映されなかったデザインが、反映されるはず。

ということで、以上となります。
もしCSSを更新して、ブラウザ上で中々反映されない状況に陥ったら、この記事で解決してください(`・ω・´)ゞ

人気記事Amazonアソシエイトに落ちる?【もしもアフィリエイトで解決します】

人気記事【2019年】ミニマリストが買ってよかった物&手放してよかった物

スポンサードサーチ