Предотвратить кеширование файла стилей и скриптов темы
Как мы знаем, файлы стилей (с расширением .css) кешируются браузером посетителя, и, если вы внесли очередное изменение в этот файл, то тот же самый посетитель может не заметить никаких изменений, пока кеш в его браузере не будет сброшен.
Есть очень простой и практичный способ, как принудительно сбрасывать кеш посетителя, если вы изменили CSS-файл.
В файле header.php находим строку, похожую на эту:
<link rel="stylesheet" href="<?php bloginfo('stylesheet_url'); ?>" type="text/css" media="screen" />
<?php bloginfo('stylesheet_url'); ?> – этот код формирует ссылку на CSS-файл темы. Сразу же после него нужно вставить вот такой код:
?<?php echo filemtime(TEMPLATEPATH . '/style.css') ?>
В результате должна получиться следующая строка:
<link rel="stylesheet" href="<?php bloginfo('stylesheet_url'); ?>?<?php echo filemtime(TEMPLATEPATH . '/style.css') ?>" type="text/css" media="screen" />
По аналогии можно поступать и с файлами скриптов (JavaScript), которые вы подключаете в файле header.php.
В результате применения вышеуказанного кода адрес до файла вместо изначального вида: http://путь_до_файла/style.css обретает следующий вид: http://путь_до_файла/style.css?1243581957.
Цифры, стоящие после имени файла, будут меняться после каждого сохранения файла. Именно это и заставит браузер сбросить кеш, если файл был изменен.
—–
Фирма, работающая на рынке автозапчастей более 10 лет, предлагает оригинальные и неоригинальные запчасти Ниссан (Nissan) и Infiniti. Вы можете заказать любую деталь из более 10 тысяч наименований запчастей. Заявку можно сделать прямо на сайте.
А если путь к стилям прописан прямо, а не через запрос, тогда как?
Что значит “прямо”?
Без лишнего запроса. Я же и так знаю, где он у меня лежит, поэтому вписал просто:
<link rel=”stylesheet” href=”http://sitename.ru/wp-content/themes/default/style.css” type=”text/css” media=”screen” />
Тогда у вас будет такой код:
<link rel="stylesheet" href="http://sitename.ru/wp-content/themes/default/style.css?<?php echo filemtime('http://sitename.ru/wp-content/themes/default/style.css') ?>" type="text/css" media="screen" />Ага, понял. Спасибо!
Насколько я знаю, браузеры сначала проверяют дату создания файла, если она отличается, от даты в кеше, то файл перезагружается, в противном случае берется из кеша.
По карайней мере в Ослике, Опере, Лисе, Хроме именно так, в в других браузерах наверное тоже самое.
Подозреваю, что я где-то не прав, а то б наверное не было этой статьи…?
Я не уверен, что все так, как вы говорите, но то, что описано в статье, точно указывает браузеру, что файл стилей обновился.
У меня другой вопрос.
Как сделать обратное? То есть, заставить браузер не грузить стили, если данный файл уже есть в кэше? Дело в том, что файл стилей зачастую — самый большой (не считая картинок). И если пользователь приходит на сайт каждый день, то сайт у него будет отрываться немного быстрее.
Понятно, что в браузерах это решено путём проверки даты файла. Но если это по каким-либо причинам не работает?
То, что пользователь чего-то не увидит в случае изменений, лично меня не очень пугает. Изменения происходят не так часто. А кэш по умолчанию, как правило, небольшой. Успеет обновиться.
То есть, в идеале хак может выглядеть так: такой-то файл (или даже тип файлов — картинки, например) не грузить, если он есть в кэше.
На счет CSS – браузеры как раз таким образом и устроены, что они сохраняют файл стилей в кэше, и при переходе на другие страницы сайта он берется именно из кэша. При определенных условиях кэш, конечно, обновляется, но этих тонкостей не знаю.
Сделал, как написали, но ничего не выводится, после знака ?
Возможно, что на хостинге нет какого-то php-модуля.
Огромное спасибо за статью. Мне очень помогла. На сайте для меню меняю стиль динамически с помощью php (чтобы запомнить из какого подраздела был переход на другую страницу и соответствующим образом отображать меню). Firefox и Chrome сразу поняли мою мысль, а вот IE и Opera упорно косячили, как потом догадался, из-за кеширования css-файла. C Вашей помощью проблема решена.