Jak naprawić problem z niewidocznym obrazem wyróżniającym w WordPress

Brak wyświetlania obrazu wyróżniającego w WordPress może być poważnym problemem.

Te obrazy są ważne, aby przyciągnąć uwagę odwiedzających i zwiększyć współczynniki klikalności. Kiedy się nie pojawiają, może to być frustrujące i wpływać na wydajność Twojej witryny.

Czasami napotykaliśmy ten problem na naszym blogu, więc wiemy, jak bardzo może być irytujący. Dobra wiadomość jest taka, że wiemy, jak sobie z nim poradzić.

W tym przewodniku przeprowadzimy Cię przez kilka prostych kroków, aby naprawić problem z niewidocznymi obrazami wyróżniającymi w WordPress.

Czym są obrazy wyróżniające i dlaczego nie pojawiają się w WordPressie?

Obrazy wyróżniające pojawiają się na stronie listy wpisów na blogu, a czasem w nagłówku wpisu. Podobnie jak miniatury YouTube, celem obrazu wyróżniającego jest zwiększenie liczby wyświetleń strony i zaangażowania użytkowników.

Co więcej, obrazy wyróżniające są również używane do reprezentowania poszczególnych artykułów na stronach najnowszych wpisów, archiwów i wyników wyszukiwania.

Ponadto styl Twoich obrazów wyróżnionych nadaje ton reszcie Twojego wpisu na blogu.

Prawie wszystkie motywy WordPress pozwalają na przesyłanie obrazów wyróżniających i dają możliwość ich wyświetlania w różnych obszarach witryny, takich jak menu boczne lub główny obszar treści.

Jeśli rozwiązujesz ten problem, możesz zapoznać się z naszym poradnikiem jak dodać grafiki wyróżniające lub miniatury wpisów w WordPress. Ważne jest, aby najpierw wiedzieć, jak przesyłać grafiki wyróżniające.

Można łatwo przez pomyłkę przesłać obrazek okładki zamiast obrazka wyróżniającego, lub możesz mieć motyw, który automatycznie sprawia, że pierwszy obrazek w poście pojawia się jako miniaturka posta.

Mając to na uwadze, pokażemy Ci, jak rozwiązać potencjalne problemy, które mogą się pojawić. Zachęcamy do korzystania z naszych linków, aby przejść do problemu, z którym aktualnie się borykasz:

1. Napraw błąd HTTP podczas przesyłania obrazu wyróżniającego
2. Napraw wtyczki lub motywy
3. Wyłącz leniwe ładowanie
4. Zezwól na wyświetlanie grafik wyróżniających
5. Naprawianie problemu z niewidocznym obrazem wyróżniającym na stronie galerii wpisów na blogu
6. Dodaj niestandardowy kod, aby naprawić problemy z obrazem wyróżniającym

Pożegnaj się z problemami brakujących wyróżnionych obrazków – zanurzmy się i rozwiążmy ten problem razem!

1. Napraw błąd HTTP podczas przesyłania obrazu wyróżniającego

Jeśli spróbujesz przesłać obraz wyróżniający o dużej wielkości pliku, możesz otrzymać niejasny komunikat „Błąd HTTP”. Często oznacza to, że plik obrazu jest zbyt duży lub że musisz zwiększyć limit pamięci swojej witryny, aby umożliwić przesyłanie większych plików do Twojej witryny WordPress.

Istnieją dwa główne sposoby rozwiązania tego problemu. Ale najpierw upewnij się, że wylogowałeś się z WordPressa, a następnie zalogowałeś ponownie. Często pozwoli to na ponowne normalne przesyłanie obrazów.

Jeśli nie, wypróbuj jedną z dwóch poniższych metod:

1. Zmniejsz rozmiar pliku obrazu.
2. Zwiększ limit pamięci WordPress.

Najpierw zacznijmy od prostszej metody, zmniejszenia rozmiaru pliku obrazu. Jeśli rozmiar jest problemem, możesz przełączyć się na format obrazu WebP, JPEG lub PNG. JPEG to skompresowany format pliku, który nieznacznie zmniejsza jakość obrazu, aby znacznie zmniejszyć jego rozmiar, a pliki WebP są już bardzo małe.

Następnie będziesz chciał skompresować rozmiar pliku za pomocą narzędzia do kompresji obrazów, takiego jak TinyPNG lub JPGmini.

Wszystko, co musisz zrobić, to przesłać obraz do narzędzia, a następnie możesz pobrać skompresowaną wersję pliku.

Więcej informacji znajdziesz w naszym przewodniku na temat optymalizacji obrazów dla wydajności sieci bez utraty jakości.

Jeśli już skompresowałeś rozmiar obrazu i nadal masz problem z błędem HTTP, być może będziesz musiał zwiększyć limit pamięci WordPress. Możesz po prostu skontaktować się ze swoim obecnym dostawcą hostingu i poprosić o rozszerzenie limitu PHP lub uaktualnienie planu hostingowego.

Możesz jednak zmienić limit pamięci PHP, co wymaga modyfikacji plików wp-config.php lub .htaccess. W obu przypadkach będziesz potrzebować klienta FTP lub Menedżera plików.

W przypadku tej metody warto użyć wtyczki takiej jak WPCode, która pozwala na dodawanie niestandardowych rozwiązań bez psucia strony. WPCode to najlepsza wtyczka fragmentów kodu na rynku, używana przez ponad 2 miliony stron internetowych do zabezpieczania przyszłych modyfikacji stron za pomocą fragmentów kodu.

Jeśli chcesz edytować plik .htacess, musisz przejść do folderu głównego witryny WordPress. Następnie, przed linią mówiącą „#END WORDPRESS”, możesz wkleić następujący kod:

define( 'WP_MEMORY_LIMIT', '256M' ); 

Aby uzyskać więcej informacji na temat zwiększania limitu pamięci, zapoznaj się z naszym poradnikiem na temat jak naprawić błędy wyczerpania pamięci WordPress, aby zwiększyć pamięć PHP.

2. Napraw wtyczki lub motywy

Niektóre motywy i wtyczki WordPress mogą ograniczać wyświetlanie obrazu.

Chociaż większość motywów WordPress automatycznie wyświetla Twoje obrazy wyróżnione, niektóre wymagają ręcznej konfiguracji przez administratora. W takim przypadku może być konieczne sprawdzenie ustawień motywu WordPress lub skontaktowanie się z pomocą techniczną motywu.

Aby uzyskać więcej informacji, zapoznaj się z naszym kompletnym przewodnikiem po tym, jak używać WordPress Theme Customizer.

Jeśli motyw nie powoduje problemu, możesz również sprawdzić, czy wtyczki są głównym winowajcą.

Możesz zacząć od zaktualizowania wszystkich swoich wtyczek. Jeśli to nie rozwiąże problemu, dezaktywuj wszystkie wtyczki, a następnie aktywuj je pojedynczo.

Po każdej instalacji możesz sprawdzić, czy obrazy wyróżniające wyświetlają się poprawnie. Jeśli obraz wyróżniający się nie pojawi, będziesz wiedzieć, która wtyczka powoduje problem.

Możesz również użyć wtyczki Health Check & Troubleshooting. Ta darmowa wtyczka wykonuje serię kontroli w celu wykrycia błędów konfiguracyjnych i znanych błędów we wtyczkach i motywach.

Jeśli potrzebujesz pomocy z instalacją, przeczytaj nasz przewodnik jak zainstalować wtyczkę WordPress.

Po aktywacji przejdź do Narzędzia » Stan witryny. Stąd otrzymasz listę zaleceń, które pomogą Ci poprawić bezpieczeństwo WordPress i wydajność.

Widać tu, że zainstalowanych jest wiele nieaktualnych i nieaktywnych wtyczek i motywów, którymi należy się zająć. Po prostu kliknij podane linki, aby zarządzać lub zaktualizować swoje wtyczki.

3. Wyłącz lenistwo ładowania

Lenistwo (lazy loading) to funkcja, która pomaga poprawić szybkość ładowania strony i wydajność WordPressa poprzez szybkie dodawanie treści i widocznego obszaru jako pierwszego.

Szybsza strona internetowa poprawia rankingi strony, ponieważ wyszukiwarki takie jak Google uważają szybkość za ważny czynnik rankingowy.

W zasadzie leniwe ładowanie zatrzymuje ładowanie obrazów na stronie, dopóki nie znajdą się one w zasięgu wzroku na ekranie. Na przykład ostatni obraz w długim wpisie na blogu nie będzie musiał się ładować, dopóki użytkownik faktycznie nie przewinie w dół i nie dotrze do tego obrazu.

Niemniej jednak leniwe ładowanie może powodować problemy z obrazami wyróżniającymi, ponieważ niektóre wtyczki do leniwego ładowania mogą traktować obrazy wyróżniające jak zwykłe zdjęcia. Może to spowodować powolne ładowanie obrazu wyróżniającego lub całkowicie zablokować jego pojawienie się na liście najnowszych wpisów.

Ponadto niektóre wtyczki do optymalizacji obrazów będą miały funkcję leniwego ładowania jako dodatek. W związku z tym będziesz chciał sprawdzić każdą zainstalowaną wtyczkę, aby zobaczyć, czy ta funkcja jest włączona.

Możesz wyłączyć funkcję leniwego ładowania w swoich wtyczkach i wyczyścić pamięć podręczną, aby sprawdzić, czy rozwiąże to problem z obrazami wyróżniającymi.

Niektóre wtyczki pozwalają wykluczyć określone zdjęcia z leniwego ładowania. Jeśli tak jest, możesz wyłączyć tę funkcję tylko dla pierwszego obrazu w swoich postach na blogu, aby nadal korzystać z leniwego ładowania bez wpływu na Twoje obrazy wyróżniające.

Możesz łatwo wyłączyć kod, dostosowując fragment kodu za pomocą WPCode. Najpierw musisz przejść do strony Fragmenty kodu » + Dodaj fragment z panelu administracyjnego WordPress.

Następnie wystarczy skopiować i wkleić ten kod PHP do pola „Podgląd kodu”:

add_filter( 'wp_lazy_loading_enabled', '__return_false' ); 

Tak powinno to wyglądać po wklejeniu.

Upewnij się, że jako „Typ kodu” wybrałeś również „Fragment PHP”.

Na koniec włączysz wtyczkę, aby była aktywna, i klikniesz przycisk „Zapisz fragment”.

Aby uzyskać więcej informacji, zapoznaj się z naszym poradnikiem krok po kroku, jak prawidłowo wyłączyć leniwe ładowanie w WordPressie.

4. Zmiana uprawnień ról użytkowników, aby umożliwić przesyłanie obrazów wyróżniających

WordPress oferuje sześć domyślnych ról użytkowników do zarządzania dostępem i działaniami wszystkich użytkowników na stronie.

Jeśli nie jesteś właścicielem witryny, prawdopodobnie nie masz wymaganego poziomu uprawnień użytkownika do przesyłania lub przeglądania grafik wyróżniających.

Wszystko, co musisz zrobić, to upewnić się, że Twoje role i uprawnienia użytkowników są poprawnie skonfigurowane.

Prostym sposobem na rozwiązanie tego problemu jest użycie wtyczki takiej jak User Role Editor, dzięki czemu możesz zmieniać role i uprawnienia w jednym miejscu.

Po prostu przejdź do Użytkownicy » Edytor ról w swoim panelu WordPress.

Stąd wybierzesz rolę, którą chcesz zmienić w sekcji „Wybierz rolę” i zmienisz jej uprawnienia. W tym przypadku wybierzemy „Autora”.

Następnie, używając opcji „Szybkie filtrowanie”, będziesz chciał poszukać „upload_files”.

Na koniec, wystarczy kliknąć przycisk „Zaktualizuj”, aby wprowadzić te zmiany.

Ta wtyczka pozwala również tworzyć nowe niestandardowe role i nadawać im dostęp do wybranych uprawnień.

5. Naprawianie problemu z niewidoczną grafiką wyróżniającą na stronie galerii wpisów blogowych

Jednym z najlepszych sposobów wykorzystania wyróżnionych obrazków jest prezentowanie swoich wpisów na blogu na stronie głównej Twojej witryny.

Ale co, jeśli wyróżnione obrazy nie pojawią się na stronie bloga?

Aby rozwiązać ten problem, możesz edytować swoją stronę główną lub dowolną stronę, na której chcesz wyświetlać wyróżnione obrazy.

Następnie kliknij ikonę „+” i dodaj blok „Najnowsze posty” do posta na stronie. Stąd pojawią się linki do Twoich ostatnich postów.

Po prostu kliknij blok i włącz opcję „Wyświetl obraz wyróżniający”.

Następnie będziesz mógł dostosować inne ustawienia, takie jak wyrównanie i rozmiar obrazu wyróżniającego, aby pasowały do Twojej strony.

Stąd obrazy wyróżniające powinny pojawić się w galerii wpisów na blogu.

Tak będą wyglądać obrazy wyróżniające, gdy się pojawią.

6. Dodaj niestandardowy kod, aby naprawić problemy z obrazami wyróżnionymi

Czasami miniatury postów nie są klikalne z powodu Twojego obecnego motywu WordPress, który może nie obsługiwać tej konkretnej funkcjonalności.

Być może chcesz dodać swoje obrazy wyróżniające do kanałów RSS lub wyświetlić obraz wyróżniający na liście wpisów w obszarze administracyjnym.

Wszystko to można zrobić za pomocą WPCode.

Po aktywacji przejdź do Fragmenty kodu » + Dodaj fragment. Zostaniesz przeniesiony do biblioteki gotowych opcji niestandardowego kodu.

Wpisz „obrazek wyróżniający” w pasku wyszukiwania, aby zobaczyć wszystkie dostępne opcje niestandardowego kodu do dodawania obrazków wyróżniających do Twojej witryny.

Stąd po prostu wybierz żądaną opcję.

Na przykład, powiedzmy, że chcemy dodać kolumny z obrazkami wyróżniającymi do naszego panelu administracyjnego WordPress. Po prostu najedź na opcję i wybierz „Użyj fragmentu”.

Następnie zostaniesz przeniesiony na stronę, na której możesz edytować fragment. Na szczęście kod jest już wstępnie ustawiony, więc nie musisz grzebać w kodzie ani ustawieniach.

Ale jeśli musisz wprowadzić kod ręcznie, możesz go skopiować i wkleić poniżej:

add_filter( 'manage_posts_columns', function ( $columns ) {	// You can change this to any other position by changing 'title' to the name of the column you want to put it after.	$move_after = 'title';	$move_after_key = array_search( $move_after, array_keys( $columns ), true );	$first_columns = array_slice( $columns, 0, $move_after_key + 1 );	$last_columns = array_slice( $columns, $move_after_key + 1 );	return array_merge(	$first_columns,	array(	'featured_image' => __( 'Featured Image' ),	),	$last_columns	); } ); add_action( 'manage_posts_custom_column', function ( $column ) {	if ( 'featured_image' === $column ) {	the_post_thumbnail( array( 300, 80 ) );	} } ); 

Następnie po prostu przełącz przycisk, aby włączyć niestandardowy fragment kodu i kliknij „Zaktualizuj”.

Powinno to zapisać wszystkie wprowadzone właśnie zmiany.

Następnie możesz przejść do strony Wpisy » Wszystkie wpisy w swoim panelu administracyjnym.

Na tej stronie widać, że miniatury postów pojawiają się w dedykowanej kolumnie.

Następnie możesz również przeczytać nasz post o jak automatycznie linkować obrazy wyróżniające do postów w WordPressie lub nasz tutorial o jak dodać miniatury postów do kanałów RSS WordPress.

Naprawianie problemu z obrazkiem wyróżniającym WordPress nie wyświetlającym się w odpowiednim rozmiarze

Czasami wyróżniony obrazek w WordPressie może nie wyświetlać się w odpowiednim rozmiarze. Najlepiej jest zrozumieć najlepsze praktyki dotyczące wyróżnionych obrazków, aby uniknąć problemów już na samym początku.

Wybór odpowiednich grafik do obrazów wyróżnionych

Optymalny rozmiar wyróżnionego obrazka dla prostokątnych wyróżnionych obrazków to 1200 x 687 pikseli. Jednak dla motywów używających kwadratowych obrazków wyróżnionych, najlepszy rozmiar to 600 x 600 pikseli.

Aby uzyskać więcej informacji, przeczytaj nasz poradnik na temat jak wykonywać podstawową edycję obrazów w WordPressie.

Zmiana domyślnych rozmiarów obrazów w WordPress

Jeśli miniatury na Twoim blogu wydają się za małe lub za duże, możesz ręcznie edytować domyślne rozmiary obrazów.

WordPress automatycznie utworzy kopie Twoich obrazów wyróżniających, aby dodać je do różnych obszarów Twojej witryny, takich jak strona bloga, strony archiwum i strona główna.

Motywy WordPress mają swoje własne wymiary obrazów, ale czasami nadal możesz chcieć dostosować rozmiar swojego wyróżnionego obrazka.

Aby to zrobić, przejdź do Ustawienia » Multimedia z obszaru administracyjnego WordPress. Następnie w polach rozmiaru „Miniatura” wprowadź nowe wymiary dla swojego obrazu wyróżniającego.

Bardziej szczegółowe instrukcje znajdziesz w naszym przewodniku dla początkujących po rozmiarach obrazów w WordPress.

Obrazki wyróżniające nie pojawiają się na Facebooku

Obrazy wyróżniające są pobierane z WordPress i popularne na platformach mediów społecznościowych dzięki Open Graph, technologii, która pozwala serwisom społecznościowym, takim jak Facebook, rozumieć i wyświetlać treści z witryny internetowej.

Tagi meta Open Graph można dodawać do poszczególnych wpisów i stron, aby kontrolować sposób ich wyświetlania podczas udostępniania. Tagi te zawierają informacje takie jak tytuł treści, opis i obraz wyróżniający.

Najprostszym sposobem na zapewnienie, że wszystkie obrazy wyróżniające pojawią się na Facebooku, jest użycie All in One SEO. Jest to najlepsza wtyczka SEO dla WordPress do ulepszania i optymalizacji Twojej witryny pod kątem wyższych pozycji w wyszukiwarkach.

Po aktywacji przejdź do All in One SEO » Social Networks. Następnie w zakładce „Facebook” upewnij się, że włączyłeś opcję „Enable Open Graph Markup”.

To automatycznie wyświetla podgląd Twoich wpisów na blogu z obrazem wyróżniającym i krótkim fragmentem tekstu.

Więcej szczegółów znajdziesz w naszym przewodniku na temat dodawania metadanych Facebook Open Graph w motywach WordPress.

Mamy nadzieję, że ten artykuł pomógł Ci rozwiązać problem z niewidocznym obrazem wyróżnionym w WordPress. Możesz również zapoznać się z naszą listą najczęstszych błędów WordPress i sposobów ich naprawy, a także z naszym przewodnikiem jak odzyskać i przywrócić usunięte strony.

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.