Uszkodzony CSS w panelu administracyjnym WordPress na początku wygląda przerażająco. Ale dowiedzieliśmy się, że jest to zazwyczaj prosta reakcja łańcuchowa spowodowana przez wtyczkę lub regułę buforowania, którą możemy szybko zidentyfikować.
Po pomocy tysiącom czytelników i klientów opracowaliśmy listę kontrolną, która precyzyjnie wskazuje winowajcę, nie naruszając Twoich treści ani nie ryzykując przestojów.
Zostań z nami, a przeprowadzimy Cię przez każdy krok, dzięki czemu Twój obszar administracyjny wróci do normy i będziesz mógł dalej tworzyć z pewnością siebie.
Oto szybki przegląd tematów i kroków rozwiązywania problemów, które omówimy w tym artykule:
- Co powoduje uszkodzenie CSS w obszarze administracyjnym WordPressa?
- Krok 1: Sprawdź konflikty wtyczek
- Krok 2: Ładowanie niezabezpieczonych plików przez HTTPS
- Krok 3: Sprawdź konflikty motywów
- Krok 4: Napraw problemy z pamięcią podręczną
- Krok 5: Rozwiązywanie problemów z CDN
- Krok 6: Napraw nieprawidłowe uprawnienia do plików
- Krok 7: Napraw uszkodzone pliki
- Krok 8: Sprawdź rozszerzenia przeglądarki
- Wskazówki dotyczące rozwiązywania problemów
Co powoduje uszkodzenie CSS w obszarze administracyjnym WordPressa?
Istnieje kilka powodów, dla których CSS może się zepsuć w obszarze administracyjnym WordPress. Jednak, podobnie jak wiele najczęstszych błędów WordPress, dla początkujących może być frustrujące ustalenie, co należy naprawić.
Z naszego doświadczenia wynika, że następujące czynniki są głównymi przyczynami uszkodzonego CSS w obszarze administracyjnym WordPressa:
- Konflikty wtyczek: Źle napisane wtyczki z własnym kodem CSS mogą powodować konflikty ze standardowymi stylami WordPress, nadpisując lub zakłócając style obszaru administracyjnego.
- Niezgodność HTTP/HTTPS: Problemy z mieszaną zawartością, gdzie niektóre pliki ładują się przez HTTP zamiast HTTPS, mogą powodować blokowanie plików CSS przez przeglądarki.
- Konflikty motywów: Niektóre motywy ładują CSS w obszarze administracyjnym, co może powodować konflikty. Jeśli używasz niestandardowego motywu administracyjnego, może to również powodować problemy ze stylami.
- Problemy z pamięcią podręczną: Pamięć podręczna przeglądarki może zawierać nieaktualne wersje plików CSS. Wtyczki buforujące mogą serwować stare pliki CSS, powodując problemy ze stylami.
- Problemy z CDN: Źle skonfigurowane sieci dostarczania treści (CDN) mogą serwować nieaktualne wersje plików CSS, prowadząc do brakujących lub uszkodzonych stylów.
- Nieprawidłowe uprawnienia plików: Pliki CSS z nieprawidłowymi uprawnieniami mogą nie być czytelne dla serwera.
- Uszkodzone pliki: Pliki CSS mogą ulec uszkodzeniu lub zniknąć podczas aktualizacji lub przesyłania.
- Rozszerzenia przeglądarki: Rozszerzenia, zwłaszcza blokery treści, mogą zakłócać sposób wyświetlania CSS.
Zrozumienie tych przyczyn pomoże Ci zidentyfikować, dlaczego Twój obszar administracyjny WordPress doświadcza problemu z uszkodzonym CSS, dzięki czemu będziesz mógł go faktycznie naprawić.
Krok 1: Sprawdź konflikty wtyczek
Z naszego doświadczenia wynika, że często winowajcami problemów z CSS w obszarze administracyjnym są źle napisane wtyczki WordPress. Jednak czasami nawet dobrze napisane wtyczki mogą napotkać problemy związane z konfiguracją Twojej witryny WordPress lub serwera.
Oto jak możesz zidentyfikować i rozwiązać konflikty wtyczek.
Dezaktywuj wszystkie wtyczki
Najpierw musisz przejść do swojego panelu administracyjnego WordPress i przejść do strony Wtyczki » Zainstalowane wtyczki.
Teraz zaznacz wszystkie wtyczki i wybierz „Dezaktywuj” z menu rozwijanego „Akcje zbiorcze”, a następnie kliknij „Zastosuj”.
Następnie po prostu odśwież obszar administracyjny lub przeładuj stronę, aby sprawdzić, czy problem z CSS został rozwiązany. Jeśli CSS jest naprawiony, problem leży po stronie jednej z wtyczek.
Ponownie aktywuj wtyczki jedna po drugiej
Aby określić, który wtyczka powoduje problem, musisz ponownie aktywować każdą z nich indywidualnie. Możesz to zrobić, klikając link „Aktywuj” pod wtyczką.
Po aktywacji każdej wtyczki musisz odświeżyć obszar administracyjny, aby sprawdzić, czy CSS nadal się psuje.
Pomoże Ci to zidentyfikować konkretną wtyczkę powodującą problem.
Znajdź alternatywę lub zaktualizuj wtyczkę
Gdy zidentyfikujesz konfliktujący wtyczkę, możesz sprawdzić, czy jest dostępna jej aktualizacja. Jeśli aktualizacja nie rozwiąże problemu, rozważ znalezienie alternatywnej wtyczki lub skontaktowanie się z jej twórcą w celu uzyskania pomocy.
Szczegółowe instrukcje znajdziesz w naszym poradniku na temat dezaktywacji wtyczek. Ten poradnik pokazuje również, jak dezaktywować wtyczki za pomocą FTP, jeśli obszar administracyjny WordPressa nie jest dostępny.
Krok 2: Ładowanie niezabezpieczonych plików przez HTTPS
Inną częstą przyczyną uszkodzonego CSS, na którą natknęli się nasi użytkownicy, jest nieprawidłowo skonfigurowane bezpieczne adresy URL, co prowadzi do problemów z mieszaną zawartością.
Dzieje się tak, gdy Twoja strona internetowa jest skonfigurowana do używania bezpiecznego protokołu HTTPS, ale CSS jest serwowany z protokołu HTTP lub niezabezpieczonego protokołu.
Kiedy tak się dzieje, popularne przeglądarki, takie jak Google Chrome, automatycznie blokują niezabezpieczone zasoby, co skutkuje uszkodzonym CSS w obszarze administracyjnym WordPress.
Ten problem można potwierdzić za pomocą narzędzia Inspekcja w przeglądarce. Po prostu przełącz się na kartę Konsola, a zobaczysz błąd mieszanej zawartości (Mixed Content).
Aby rozwiązać ten problem, musisz najpierw upewnić się, że ustawienia WordPress zawierają poprawne adresy URL.
Przejdź do strony Ustawienia » Ogólne i upewnij się, że zarówno Adres WordPress, jak i Adres strony zawierają HTTPS w adresach URL.
Jeśli masz już HTTPS w obu adresach URL, możesz ręcznie wymusić na WordPressie używanie protokołu HTTPS.
Po prostu edytuj swój plik wp-config.php i dodaj następujący kod:
define('FORCE_SSL_ADMIN', true);
if (strpos($_SERVER['HTTP_X_FORWARDED_PROTO'], 'https') !== false) {
$_SERVER['HTTPS'] = 'on';
}
Alternatywnie możesz użyć wtyczek takich jak Really Simple SSL, aby wymusić HTTPS dla wszystkich adresów URL.
Więcej informacji znajdziesz w naszym poradniku jak naprawić błąd mieszanej zawartości w WordPress.
Krok 3: Sprawdź konflikty motywów
Odkryliśmy, że niepotrzebne ingerencje w motyw są również częstą przyczyną uszkodzonego CSS w obszarze administracyjnym WordPress.
Oto jak możesz zidentyfikować i rozwiązać problemy związane z motywem.
Przełącz się na domyślny motyw
Aby sprawdzić, czy Twój motyw WordPress powoduje uszkodzenie CSS, najpierw musisz przełączyć się na domyślny motyw WordPress.
Przejdź do swojego panelu WordPress i nawiguj do strony Wygląd » Motywy.
Tutaj musisz aktywować domyślny motyw WordPress, taki jak Twenty Twenty-Four.
Uwaga: Jeśli nie masz zainstalowanych żadnych domyślnych motywów, możesz zainstalować jeden, klikając przycisk „Dodaj nowy motyw” u góry. Domyślne motywy WordPress są nazwane od lat.
Odśwież swój obszar administracyjny po przełączeniu na domyślny motyw, aby sprawdzić, czy problem z CSS został rozwiązany.
Jeśli CSS ładuje się teraz poprawnie, problem leży po stronie Twojego poprzedniego motywu.
Naprawianie konfliktu motywów
Aby to naprawić, najpierw musisz sprawdzić, czy dostępna jest aktualizacja dla Twojego motywu.
Przejdź do Wygląd » Motywy, wybierz swój motyw i kliknij „Zaktualizuj teraz”.
Jeśli to nie rozwiąże problemu, będziesz musiał przejrzeć wszelkie zmiany, które wprowadziłeś w swoim motywie. Sprawdź wszystkie dostosowania motywu, które mogą powodować problem z uszkodzonym CSS.
W szczególności będziesz chciał sprawdzić wszelkie dodatkowe CSS lub niestandardowy kod w pliku functions.php pod kątem błędów.
W ostateczności skontaktuj się z deweloperem motywu w celu uzyskania wsparcia lub rozważ zmianę na inny motyw.
Zalecamy używanie WPCode, aby uniknąć tego typu błędów w przyszłości. Jest to najlepsza wtyczka fragmentów kodu WordPress, która pozwala zarządzać całym niestandardowym CSS w jednym miejscu i nie wymaga edycji pliku functions.php .
Oto niektóre z zalet WPCode:
- Możesz łatwiej zapisywać i zarządzać swoim niestandardowym kodem CSS.
- WPCode zawiera wbudowane mechanizmy sprawdzania błędów.
- Nie tracisz swojego niestandardowego CSS podczas przełączania motywów.
Dostępna jest również bezpłatna wersja WPCode z ograniczonymi funkcjami.
Używamy WPCode na naszych stronach internetowych do zarządzania niestandardowymi fragmentami kodu, w tym niestandardowym CSS. Aby uzyskać więcej informacji, zobacz naszą recenzję WPCode.
Krok 4: Napraw problemy z pamięcią podręczną
Zazwyczaj wtyczki do buforowania WordPressa nie buforują obszaru administracyjnego WordPressa.
Widzieliśmy jednak przypadki, gdy nieprawidłowe ustawienia buforowania powodowały konflikt z pamięcią podręczną przeglądarki, co mogło prowadzić do problemów z uszkodzonym CSS.
Aby to naprawić, najpierw musisz wyczyścić pamięć podręczną przeglądarki.
Następnie możesz przeładować obszar administracyjny WordPress, aby zobaczyć, czy problem został rozwiązany. Jeśli nie, musisz wyczyścić pamięć podręczną WordPress.
Jest to pamięć podręczna wygenerowana przez wtyczkę buforującą WordPress. Mamy szczegółowy tutorial na temat jak wyczyścić pamięć podręczną w różnych wtyczkach buforujących WordPress.
Krok 5: Rozwiązywanie problemów z CDN
Jeśli korzystasz z usługi sieci dostarczania treści (CDN), błędna konfiguracja może czasami powodować problemy z uszkodzonym CSS w obszarze administracyjnym WordPress.
Oto jak zidentyfikować i rozwiązać te problemy.
Najpierw musisz użyć narzędzia Inspect tool w swojej przeglądarce i przełączyć się na zakładkę „Konsola”. Tutaj zobaczysz błędy, jeśli Twoje pliki CSS są zablokowane lub nie znalezione.
Następnie musisz przejść do strony internetowej swojej usługi CDN i zalogować się do swojego panelu konta.
Stąd przejdź do sekcji Caching » Konfiguracja i kliknij przycisk „Wyczyść wszystko” w opcji Wyczyść pamięć podręczną.
Uwaga: Pokazujemy zrzut ekranu Cloudflare CDN. Jednak łatwo znajdziesz opcję wyczyszczenia pamięci podręcznej u wszystkich dostawców CDN.
Następnie musisz wrócić do swojej witryny i przeładować obszar administracyjny, aby sprawdzić, czy problem został rozwiązany.
Jeśli problem nie zostanie rozwiązany, przejdź do następnego kroku.
Krok 6: Napraw nieprawidłowe uprawnienia do plików
Znaleźliśmy również nieprawidłowe uprawnienia do plików, które uniemożliwiają serwerowi odczyt plików CSS, co prowadzi do uszkodzenia CSS w obszarze administracyjnym WordPress.
Oto jak sprawdzić i naprawić uprawnienia do plików.
Najpierw musisz połączyć się ze swoją witryną WordPress za pomocą FTP.
Po połączeniu musisz przejść do głównego katalogu WordPress. Jest to katalog zawierający foldery wp-admin, wp-includes i wp-content.
Teraz kliknij prawym przyciskiem myszy na folderze wp-admin i wybierz „Uprawnienia do plików” lub „Właściwości”.
Najpierw musisz upewnić się, że wszystkie katalogi mają ustawione uprawnienia 755.
Jeśli nie są, zmień uprawnienia i zastosuj je rekursywnie do wszystkich podkatalogów.
Możesz teraz powtórzyć proces, ustawić uprawnienia na 644 i zastosować je rekursywnie tylko do wszystkich plików.
Więcej szczegółów znajdziesz w naszym poradniku jak ustawić uprawnienia do plików w WordPress.
Następnie odwiedź obszar administracyjny, aby sprawdzić, czy problem z uszkodzonym CSS został rozwiązany. Jeśli nadal występuje, musisz przejść do następnego kroku.
Krok 7: Napraw uszkodzone pliki
Uszkodzone pliki mogą powodować problemy z CSS w obszarze administracyjnym WordPressa.
Twoje pliki WordPress mogą ulec uszkodzeniu nawet bez Twojego działania. Może się to zdarzyć z powodu niekompletnej aktualizacji WordPress, przypadkowego usunięcia plików lub błędnej konfiguracji przez Twojego dostawcę hostingu WordPress.
Oto jak naprawić lub zastąpić uszkodzone pliki.
Najpierw musisz pobrać świeżą kopię WordPressa ze strony WordPress.org.
Następnie rozpakuj pobrany plik ZIP na swoim komputerze.
Następnie musisz połączyć się ze swoim WordPressem za pomocą FTP i przesłać świeże pliki WordPressa z komputera.
Wybierz „Nadpisz” po wyświetleniu monitu, aby upewnić się, że świeże pliki zostały przesłane do Twojej witryny.
Po zakończeniu możesz odwiedzić obszar administracyjny WordPress, aby sprawdzić, czy to rozwiązało problem z uszkodzonym CSS.
Jeśli to nie rozwiąże problemu, czas przejść do następnego kroku.
Krok 8: Sprawdź rozszerzenia przeglądarki
Rozszerzenia przeglądarki, zwłaszcza te związane z blokowaniem treści i reklam, mogą zakłócać sposób wyświetlania CSS w obszarze administracyjnym WordPress.
Oto jak zidentyfikować i rozwiązać problemy spowodowane przez rozszerzenia przeglądarki.
Najpierw musisz otworzyć przeglądarkę i przejść do menu rozszerzeń/dodatków.
Tymczasowo wyłącz wszystkie rozszerzenia, zwłaszcza blokery reklam i dodatki zabezpieczające.
Możesz po prostu wyłączyć rozszerzenia lub całkowicie je usunąć.
Gdy to zostanie zakończone, możesz przejść do obszaru administracyjnego WordPressa, aby sprawdzić, czy problem z CSS został rozwiązany.
Jeśli problem zostanie rozwiązany, musisz dowiedzieć się, które rozszerzenie spowodowało problem.
Aktywuj ponownie każde rozszerzenie indywidualnie i odśwież obszar administracyjny po włączeniu każdego rozszerzenia, aby zidentyfikować to, które powoduje problem.
Po zidentyfikowaniu problematycznych rozszerzeń możesz sprawdzić ich ustawienia, aby uniknąć blokowania CSS w obszarze administracyjnym WordPress.
Jeśli to nie zadziała, spróbuj znaleźć alternatywne rozszerzenie.
Wskazówki dotyczące rozwiązywania problemów
Mam nadzieję, że powyższe kroki rozwiążą problemy z CSS w obszarze administracyjnym WordPress. Jeśli jednak żaden z powyższych kroków nie zadziała, możesz wypróbować te dodatkowe wskazówki:
Zaktualizuj linki stałe:
Odśwież swoje permalinki WordPress, aby zaktualizować plik .htaccess bez ryzyka błędów. Czasami reguły przepisywania WordPress mogą uniemożliwić poprawne ładowanie plików CSS. Ta akcja pomaga wyczyścić i zresetować reguły przepisywania adresów URL.
Skanowanie pod kątem złośliwego oprogramowania:
Czasami próba włamania lub złośliwe oprogramowanie mogą również spowodować, że Twój obszar administracyjny będzie wyglądał na uszkodzony. Przeskanuj swoją witrynę WordPress pod kątem potencjalnego złośliwego oprogramowania i spróbuj oczyścić swoją zhakowaną witrynę.
Mamy nadzieję, że ten artykuł pomógł Ci naprawić problem z uszkodzonym CSS w obszarze administracyjnym WordPress. Możesz również zapoznać się z naszym przewodnikiem po rozwiązywaniu problemów z WordPress, aby uzyskać dodatkowe sposoby naprawy problemów z WordPress, lub z naszym przewodnikiem, jak prawidłowo prosić o wsparcie WordPress.
Jeśli podobał Ci się ten artykuł, zasubskrybuj nasz kanał YouTube po samouczki wideo WordPress. Możesz nas również znaleźć na Twitterze i Facebooku.
Masz pytanie lub sugestię? Zostaw komentarz, aby rozpocząć dyskusję.