WordPress версия стилей и скриптов

Достаточно часто приходится вносить изменения в дизайн сайта. Если не обновить файлы стилей в кэше браузера, можно столкнуться с проблемой некорректного отображения сайта. Если администратор сайта легко решит проблему нажатием славишь Alt+F5. То как быть с другими посетителями сайта, которые понятия не имеют, что сегодня администратор неожиданно решил обновить дизайн.

Причина данной проблемы связана с заголовком Cache-Control, который веб-сервер передает вашему браузеру во время загрузки файла:

Cache-Control: max-age=86400

Директива указывает браузеру хранить копию файлов в кэше в течение суток. Таким образом, до завтрашнего дня посетитель будет любоваться съехавшей версткой. Вы можете уменьшить значение директивы max-age, хотя сути проблемы это не решает.

Полный отказ от кэширования:

Cache-Control: no-cache

Может показаться, что это полностью решает проблему. Но этот вариант имеет существенный достаток: мы увеличим нагрузку на сервер и время загрузки сайта.

Во время передачи веб-сервер может автоматически посылать заголовок Last-Modified. Но это не дает гарантии, что браузер заинтересуется этим файлом.

Единственным правильным выходом из данной ситуации будет указывать версию для CSS и JS файлов:

<link rel="stylesheet" href="https://codebeer.ru/style.css?ver=4.4" type="text/css" />

Но согласитесь, менять версию файла при каждом изменении не совсем удобно. Для WordPress я предлагаю использовать специальную функцию, которая будет автоматически добавлять в параметр ver CRC32 хеш-код файла:

function wpdocs_dequeue_script() {
    wp_register_script('jquery', get_template_directory_uri() . '/jquery.min.js', false, hash_file('crc32', get_stylesheet_directory() . '/style.css'), true);
    wp_enqueue_script('jquery');
}

Функция, которая задает версию по умолчанию для всех подключаемых файлов:

function my_wp_default_styles($styles) {
    $styles->default_version = hash_file('crc32', get_stylesheet_directory() . '/style.css');
}
add_action("wp_default_styles", "my_wp_default_styles");

Как вариант, вместо хэша можно использовать дату изменения файла:

function my_wp_default_styles($styles) {
    $styles->default_version = filemtime(get_stylesheet_directory() . '/style.css' );
}
add_action("wp_default_styles", "my_wp_default_styles");