Najpierw wyczyść cache wtyczki WordPress, a następnie odśwież stronę z pominięciem pamięci przeglądarki. W większości przypadków wystarczy użyć Ctrl+F5 w systemie Windows lub Cmd+Shift+R na macOS.
Jak wyczyścić cache CSS w WordPress?
Wtyczki cache zwykle nie usuwają wyłącznie plików CSS. Przycisk czyszczenia opróżnia cały cache strony, dlatego po tej operacji HTML, JavaScript i inne zasoby mogą zostać wygenerowane ponownie.
Wybierz instrukcję zgodną z używaną wtyczką:
- LiteSpeed Cache – w panelu WordPress otwórz LiteSpeed Cache → Kokpit, a następnie wybierz Purge All. W niektórych wersjach podobna opcja jest dostępna także na górnym pasku administracyjnym.
- WP Rocket – na górnym pasku administracyjnym wybierz WP Rocket → Clear Cache.
- W3 Total Cache – na pasku administracyjnym otwórz Performance → Purge All Caches.
Po wyczyszczeniu pamięci wtyczki wykonaj twarde odświeżenie strony. Samo kliknięcie ikony odświeżania może nadal wyświetlać zapisany wcześniej arkusz stylów.
Co zrobić, gdy zmiany CSS nadal nie są widoczne?
Jeśli problem pozostał, źródłem cache może być przeglądarka, serwer lub zewnętrzna usługa CDN. Sprawdź po kolei:
- Cache przeglądarki – użyj Ctrl+F5 w Windows albo Cmd+Shift+R na macOS. Skrót pobiera stronę ponownie z pominięciem zapisanych zasobów.
- Cache serwerowy – hosting może korzystać z Nginx, Varnish lub innego mechanizmu buforowania. W panelu hostingu poszukaj opcji typu „Wyczyść cache” albo „Purge cache”.
- Cache CDN – jeśli strona korzysta z Cloudflare lub innego CDN, wyczyść pamięć także w tej usłudze. W Cloudflare służy do tego opcja Purge Cache.
- Minifikacja i łączenie CSS – wtyczka może wyświetlać wygenerowany, zminifikowany arkusz zamiast pliku, który właśnie edytujesz. Po zmianie CSS wyczyść cache oraz ponownie wygenerowane zasoby.
Uwaga: po opróżnieniu cache strona może przez kilka pierwszych wizyt ładować się wolniej. Serwer musi ponownie utworzyć pliki pamięci podręcznej, w tym zoptymalizowane arkusze CSS. Nie oznacza to awarii witryny.
Jak nie czyścić cache po każdej zmianie?
Podczas dłuższych prac nad wyglądem strony włącz w używanej wtyczce Development Mode albo tryb programistyczny. Funkcja tymczasowo wyłącza buforowanie, dzięki czemu kolejne odświeżenia pokazują bieżącą wersję strony.
Na czas edycji CSS dobrze jest także wyłączyć łączenie i minifikację arkuszy. Po zakończeniu prac wyłącz tryb programistyczny, przywróć optymalizację, wyczyść cache i sprawdź stronę w nowym oknie przeglądarki.
Najczęściej wystarcza sekwencja: wyczyść cache wtyczki, wyczyść cache CDN, a następnie użyj Ctrl+F5 lub Cmd+Shift+R. Jeśli nadal widzisz starą wersję, sprawdź, czy edytujesz właściwy plik CSS i czy wtyczka nie generuje jego zminifikowanej kopii.
