CSS nie aktualizuje się w przeglądarce, gdy go zmieniam

Pracuję nad CSS mojej witryny wordpress. Kiedy wprowadzam zmiany i odświeżam stronę, zmiany nie są odzwierciedlane. Po wyczyszczeniu historii przeglądarki i pamięci podręcznej zmiany są nadal odzwierciedlane. Kiedy przeglądam kod źródłowy strony i patrzę na plik css, ma on starą treść przed zmianą. Jak mogę to zaktualizować, aby móc się rozwijać?

Dodaj losowy numer wersji na końcu dołączanego pliku css. Jeśli używasz funkcji „ wp_enqueue_style ” lub wp_register_style , przekaż losowy numer (wersja) rand(111,9999)do czwartego parametru. Jeśli dołączasz css jako znacznik HTML, powinieneś dodać „ ?ver=<?php echo rand(111,999)?>” na końcu nazwy pliku. Przykłady są tutaj

wp_register_style( 'custom-style', get_template_directory_uri() . '/css/custom-style.css', array(), rand(111,9999), 'all' );

lub

<link rel="stylesheet" type="text/css" href="http://website.com/css/custom-style.css?ver=<?php echo rand(111,999)?>">

Pozwoli to uniknąć buforowania po buforowaniu po stronie klienta i ewentualnie również buforowania przez serwer.

Wiem, że ten post ma ponad rok, ale pomyślałem, że wspomnę, że CloudFlare buforuje pliki statyczne, takie jak css, js i obrazy, aby przyspieszyć ładowanie. Coś, co wymyśliłem godzinami, ponieważ miałem problemy ze zmianami css, które nie odzwierciedlały się przy ponownym ładowaniu. CloudFlare ma tryb programowania, który można włączyć na 3 godziny. Jeśli zapomnisz włączyć tę funkcję przed rozpoczęciem modyfikacji, możesz wyczyścić pamięć podręczną z zarządzania chmurą.

Możliwe, że Twój host używa czegoś takiego jak Varnish do buforowania wyników twojej witryny. Natknąłem się na to z witryną klienta hostowaną na współdzielonym koncie hostingowym o obniżonej cenie. Jedynym lekarstwem, jakie znalazłem, było po prostu cierpliwość.

Jeśli używasz motywu podrzędnego, możliwe, że musisz kolejkować arkusz stylów motywu podrzędnego, aby natychmiast zobaczyć zmiany. To rozwiązało mój problem.

Chcę tylko wskazać - pamiętaj o zainstalowanych wtyczkach buforujących . Na przykład najszybsza pamięć podręczna WP może stworzyć ten problem, jeśli nie pamiętasz, aby zalogować się do pulpitu nawigacyjnego WP i kliknąć „Wyczyść pamięć podręczną -> Usuń pamięć podręczną i zminimalizowane CSS / JS” w menu nawigacyjnym.

To może stare. Ale muszę wspierać kogoś, kto może szukać pomocy. Miałem ten sam problem i sprawdziłem wtyczki. Była wtyczka „w3 total cache”, która przyspiesza ładowanie. To jest wtyczka pamięci podręcznej po stronie serwera, więc ją wyłączyłem. Zmiany css są ponownie widoczne w czasie rzeczywistym. Istnieje wiele ładujących wtyczek wspomagających. Więc sprawdź listę wtyczek i wyłącz je, aż zakończysz programowanie.