Doskonalenie układu Twojej strony WordPress może być dużo pracy, ale jest również niezbędne dla Doświadczenia Użytkownika (UX), zaangażowania i konwersji. Dlatego frustrujące może być, gdy pozornie losowy błąd powoduje zakłócenie wyświetlania Twojej strony — na przykład gdy pasek boczny nagle pojawia się poniżej treści, a nie obok niej.
Chociaż istnieje kilka potencjalnych przyczyn, głównie sprowadza się to do problemów z językiem Hypertext Markup (HTML) lub kaskadowymi arkuszami stylów (CSS). Na szczęście problemy te są stosunkowo łatwe do naprawienia, więc szybko można przywrócić stronę do doskonałej kondycji.
W tym artykule przejdziemy przez najczęstsze przyczyny tego błędu, a następnie pokażemy, jak rozwiązać go w trzech prostych krokach. Zacznijmy!
Częste przyczyny spadania paska bocznego poniżej treści w WordPress
Paski boczne w WordPressie to obszary zawartości przeznaczone do wyświetlania po lewej lub prawej stronie głównego segmentu strony (lub czasami po obu stronach). Zazwyczaj zawierają widżety, formularze rejestracyjne, linki do powiązanych postów lub podobne treści, które chciałbyś umieścić na swojej stronie.
Z powodu różnych błędów lub problemów, twoje paski boczne mogą czasami pojawiać się na dołu strony, zamiast po lewej lub prawej stronie. Nie trzeba dodawać, że może to łatwo zrujnować dobrze zaprojektowaną stronę.
Główną przyczyną tego zachowania są problemy z HTML-em lub CSS-em na Twojej stronie. Zazwyczaj jest to wynik bezpośrednich zmian, które wprowadziłeś do kodu swojej strony, takich jak motyw lub plik pluginu.
Na przykład, może istnieć dodatkowy lub nieujawniony <div> tag na stronie. Problem może być również przypisany do nieprawidłowych ustawień szerokości i pływania w twoim CSS. Na szczęście naprawienie tego błędu jest wystarczająco łatwe.
Uniknij Stresu
Unikaj rozwiązywania problemów, gdy zapiszesz się na DreamPress. Nasi przyjaźni eksperci od WordPress są dostępni 24/7, aby pomóc rozwiązać problemy związane ze stroną — duże lub małe.
Sprawdź PlanyJak naprawić błąd paska bocznego WordPressa poniżej treści (w 3 krokach)
Teraz, gdy znasz potencjalne przyczyny tego zaskakującego błędu, nadszedł czas, aby go naprawić. Zalecamy wykonanie kolejno trzech poniższych kroków, przechodząc do następnego tylko wtedy, gdy poprzedni się nie powiódł. Przed rozpoczęciem pamiętaj, aby wykonać kopię zapasową swojej strony na wszelki wypadek.
Krok 1: Cofnij Ostatnie Zmiany
Pierwszy krok jest również najprostszy. Jeśli Twój pasek boczny przesunął się po dokonaniu zmiany na stronie — niezależnie od tego, czy jest to instalacja nowego pluginu, dodanie niestandardowego kodu czy cokolwiek innego — po prostu cofnij to. Odwrócenie działania przywraca układ do pierwotnego formatu i pomaga zlokalizować przyczynę problemu.
Możesz zacząć od cofnięcia zmiany i odświeżenia swojej strony, aby sprawdzić, czy pasek boczny wrócił na swoje właściwe miejsce. Jeśli tak, możesz następnie szukać potencjalnych problemów z jakimikolwiek zmianami, które próbowałeś wprowadzić. Na przykład, jeśli zainstalowałeś nowy plugin, sprawdź alternatywy. Jeśli zmodyfikowałeś lub dodałeś do kodu swojej strony, szukaj wszelkich literówek lub błędów składni.
Krok 2: Napraw niezamknięte tagi <div> lub usuń zbędne tagi <div>
Często przyczyną błędu paska bocznego WordPress jest niezamknięty lub dodatkowy <div> tag w kodzie Twojej strony. Te tagi HTML definiują granice sekcji na Twojej stronie. Jeśli są umieszczone nieprawidłowo, przeglądarki nie będą poprawnie renderować strony (stąd błądzący pasek boczny).
Oto przykład poprawnie sformatowanej strony:
Poniżej znajduje się ta sama strona z niezamkniętym tagiem <div>
tagi powodujące, że elementy pojawiają się w niewłaściwym miejscu.”/>Możesz zauważyć, że brakuje ukośnika w tagu zamykającym <div> . W rezultacie przeglądarka nie wie, że powinien być zamknięty, a zawartość, która powinna znajdować się na zewnątrz elementu, teraz jest wewnątrz.
Aby to naprawić, przejrzyj wszystkie zmodyfikowane pliki szablonów w poszukiwaniu brakujących lub dodatkowych tagów. Zazwyczaj te błędy można znaleźć w plikach „części szablonu” twojego motywu WordPress. Aby się tam dostać, przejdź do swojego panelu WordPress i nawiguj do Wygląd > Edytor motywów.
Wybierz odpowiedni motyw z rozwijanego menu na górze, a następnie znajdź sekcję części szablonu w pasku bocznym.
Szablony, które generują strony i posty, zazwyczaj znajdują się w sekcji content. Znajdź ten, którego potrzebujesz z listy, sprawdź go i wprowadź wszelkie poprawki. Następnie możesz kliknąć na Update File, aby zapisać zmiany.
Jeśli wiesz, który plik edytowałeś, możesz przejść bezpośrednio do niego. W przeciwnym razie będziesz musiał sprawdzić wszystkie pod kątem niezgodności.
Krok 3: Napraw błędy CSS
Kolejną częstą przyczyną tego błędu jest znalezienie w CSS Twojej strony. Sekcja Dodatkowy CSS w Niestandardowym Kostomizatorze WordPress pozwala na dodanie własnego CSS do Twojej strony.
Jeśli użyłeś tej funkcji lub edytowałeś CSS innymi sposobami, mogłeś sformatować kod nieprawidłowo. W przypadku przesuwania pasków bocznych, najczęstszym winowajcą jest właściwość „width”.
Powinieneś dokładnie sprawdzić, czy suma szerokości elementów Treść i Pasek boczny nie przekracza szerokości elementu Owijanie elementu. Jeśli tak się stanie, mniejszy element zostanie przesunięty w dół, aby pasował.
Narzędzia ułatwiające rozwiązywanie problemów z paskiem bocznym
Możesz również samodzielnie rozwiązać problem bez użycia kodu. Istnieje kilka narzędzi online, które mogą zweryfikować Twój kod i sprawdzić go pod kątem błędów.
Możesz użyć Usługi Walidacji Kodu W3C do sprawdzania kodu HTML. Usługa Walidacji CSS W3C jest odpowiednikiem dla CSS. Online Web Check jest również doskonałym narzędziem, które działa zarówno dla HTML, jak i CSS.
Te usługi są również fantastyczne, jeśli chcesz po prostu, aby ktoś drugi rzucił okiem na Twój kod, bez względu na poziom umiejętności. Szybkie sprawdzenie nikomu jeszcze nie zaszkodziło!
Możesz również usunąć naprawianie błędów WordPress z listy zadań do zrobienia dzięki naszej usłudze DreamCare. Nasz zespół ekspertów zajmuje się wszystkim w backendzie Twojej strony, aby zapewnić jej bezpieczeństwo i ciągłą działalność.
Dodatkowe zasoby WordPress
Pożegnaj się z niedziałającymi linkami i komunikatami o błędach! Przygotowaliśmy kilka przewodników, które pomogą Ci rozwiązywać każdy rodzaj problemu z WordPress:
- Przegląd typowych błędów w WordPressie
- Jak naprawić błąd 500 Internal Server Error w WordPressie
- Jak naprawić błędy składni w WordPressie
- Jak naprawić problem z niewysyłaniem e-maili przez WordPress
- Jak naprawić błąd nawiązywania połączenia z bazą danych w WordPressie
- Jak naprawić błąd 404 Not Found w WordPressie
- Jak naprawić biały tekst i brakujące przyciski w wizualnym edytorze WordPressa[b]
Jeśli szukasz więcej porad i trików dotyczących WordPressa, sprawdź nasze Samouczki WordPressa, zbiór przewodników, które pomogą Ci poruszać się po obszarze administracyjnym WordPressa jak profesjonalista.
Rozwiązywanie błędu paska bocznego
Jeśli spędziłeś czas na budowaniu pięknej strony WordPress, prawdopodobnie nie chcesz, aby cokolwiek zakłóciło jej wygląd — zwłaszcza nagłe błędy. Na szczęście, jeśli problem polega na tym, że paski boczne pojawiają się poniżej treści, rozwiązanie jest stosunkowo proste!
Aby naprawić błąd z paskiem bocznym pojawiającym się poniżej treści, możesz postępować zgodnie z tymi trzema krokami:
- Cofnij wszystkie zmiany, które wprowadziłeś na swojej stronie tuż przed pojawieniem się błędu.
- Sprawdź i napraw niezamknięte lub dodatkowe <div> tagi w swoim kodzie.
- Weryfikuj, czy CSS twojej strony jest poprawny.
Jeśli wolisz poświęcić swój czas na pracę nad swoją firmą zamiast rozwiązywania problemów ze swoją stroną internetową, rozważ przejście na DreamPress. Dzięki naszym zarządzanym planom hostingowym WordPress, my zajmujemy się problemami za Ciebie, abyś mógł skupić się na tym, co naprawdę ważne.
