I'm creating a site, I need to clear the browser history so that the changes are displayed. And how to make sure that the customer does not need to clear the browser history?

Question

css

When I create a site on my test hosting, after changing the css, I need to clear the browser history so that the browser correctly displays the changes on the site. In the process of work, I ask the client to look at the display crookedly, you need to ask him to also completely clear the history. How to avoid this memorization at the development stage?

Answer 1

1. Instead of completely clearing the history, just press Ctrl + F5.
2. When changing the style file, add a version of the file to the end and update it every time, for example: style.css?v=2

Answer 2

As an option - change the name of the CSS file, or add a parameter with a version at the end of the GET, which will be incremented on every update. The browser will see the new file, and will not pull the old one from the cache.

Answer 3

If the site is hosted, then in the php.ini file you need to write the line opcache.enable=Off or if there is a line opcache.enable=On change to Off
there is another option, but no longer convenient
to press ctrl + R or ctrl + F5 all the time like this how to clear the page cache

Answer 4

Add your version to the styles And after changing the css, change the version, v=3, etc.

Answer 5

You need to clear the cache, not the history. The easiest way is to force the browser to use the NEW version of the css file. here is the whole magic: ?v=1.1 if changes have been made, etc...
<link rel="stylesheet" href="style.css?v=1.2"

Answer 6

I'll add more. Screw less.js on the client side. The CSS will come together every time as if fresh, never seen before.

Answer 7

Alternatively, add wrappers

function enqueue_versioned_script( $handle, $src = false, $deps = array(), $in_footer = false ) {
  wp_enqueue_script( $handle, get_stylesheet_directory_uri() . $src, $deps, filemtime( get_stylesheet_directory() . $src ), $in_footer );
}
 
function enqueue_versioned_style( $handle, $src = false, $deps = array(), $media = 'all' ) {
  wp_enqueue_style( $handle, get_stylesheet_directory_uri() . $src, $deps = array(), filemtime( get_stylesheet_directory() . $src ), $media );
}

and connect using them instead of standard functions

function themename_scripts() {
  enqueue_versioned_style( 'themename', '/style.css' );
  enqueue_versioned_script( 'themename', '/js/scripts.js', array( 'jquery'), true );
}
 
add_action( 'wp_enqueue_scripts', 'themename_scripts' );

The link will change automatically and the customer's browser will download the new version of the file without the need to clear the cache in the browser

<link rel='stylesheet' id='themename-css' href='http://example.com/wp-content/themes/themename/style.css?ver=1429693860' type='text/css' media='all' />

<script type='text/javascript' src='http://example.com/wp-content/themes/themename/js/scripts.js?ver=1429694775'></script>

Read more: How to force update js and css files in WordPr...