Website Änderungen sind Caching und wird nicht für Kunden aktualisiert

Question

Ich habe einige Änderungen auf einer Live-Website (ich weiß, nicht die beste Praxis, aber mir wurde gesagt) und ich habe Probleme mit dem Caching. Jedes Mal, wenn ich eine Änderung an unserem CSS (SASS) mache, muss ich STRG F5 drücken, um die Änderungen zu sehen. Das ist kein Problem für mich, aber die Benutzer beginnen sich über eine kaputte Website zu beschweren und viele von ihnen wissen nicht, wie sie den Cache löschen oder STRG F5 verwenden.

Ich habe versucht, den folgenden Code hinzuzufügen, aber es funktioniert nicht.

<meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate" /> 
    <meta http-equiv="Pragma" content="no-cache" /> 
    <meta http-equiv="Expires" content="0" /> 

Ich habe auch versucht, dieses Skript hinzufügen:

 <script type="text/javascript"> 
     $(document).ready(function(){ 
      $('img').each(function(){ 
       var date = new Date; 
       // add the current unix timestamp in microseconds to the the image src as a query string 
       this.src = this.src + '?' + date.getTime(); 
      }); 
     }); 
    </script> 

Ich weiß Javascript nicht obwohl, so weiß ich nicht, wie man es richtig verwenden. Ich habe nach Antworten gesucht und andere Leute haben gesagt, dass diese Dinge für sie arbeiten, aber sie arbeiten einfach NICHT für mich. Ich bin ein Designer und Front-End-Entwickler, also sind PHP und Javascript ein wenig jenseits von mir.

Schließlich habe ich auch gelesen über die Verwendung von Versions-Tags -? V = x.x, aber mein Problem ist die Seite wurde von anderen Entwicklern codiert und ich habe keine Ahnung, wie sie mit unserem Stylesheet verknüpfen (mit SASS).

Jede Hilfe wäre sehr geschätzt!

Danke!

Answer 1

Rufen Sie die externe CSS-Datei und fügen Sie einen zufälligen Code als GET Variable in PHP. Etwas wie folgt aus:

<script src="yourfileUpdated.css?<?php echo rand() ?> rel="stylesheet" type="text/css" /> 

Answer 2

Im Idealfall würden Sie PHP verwenden, um die filemtime() (die Zeit, die zuletzt geändert wurde) der Datei zu überprüfen, und eine Technik versioning genannt verwenden, um anzuzeigen, es ist eine geänderte Datei, und nicht lade es aus dem Cache.

---

Das resultierende HTML würde etwas Ähnliches wie folgt aussehen:

<link href="/your/css/file.css?ver=<?php echo filemtime('/your/css/file.css'); ?>" rel="stylesheet" type="text/css"/> 

Answer 3

Styles sind mit wp_enqueue_style Funktion hinzugefügt. Suchen Sie Ihr Thema, es ist wahrscheinlich in functions.php.

Dann wie folgt verwenden:

wp_enqueue_style('main-styles', get_template_directory_uri() . '/css/style.css', array(), filemtime(get_template_directory() . '/css/style.css'), false); 

Lesen Sie hier https://wordimpress.com/wordpress-css-and-js-cache-busting/.