Jak włączyć obsługę formatu WebP w WordPress?

WebP w WordPressie włączysz najłatwiej za pomocą wtyczki, która automatycznie konwertuje obrazy JPG i PNG, a następnie podaje WebP obsługującym go przeglądarkom. Dla starszych programów pozostaje plik źródłowy, czyli tzw. fallback. Dzięki mniejszej wadze grafik strona może ładować się szybciej, a wynik w PageSpeed Insights może się poprawić.

Jaką metodę wybrać?

Wybór zależy głównie od obecnej konfiguracji witryny. Jeśli korzystasz już z narzędzia do optymalizacji i pamięci podręcznej, najwygodniej użyć jego funkcji obsługi WebP. Przykładem jest LiteSpeed Cache, który może współpracować z usługą QUIC.cloud i automatycznie przygotowywać zoptymalizowane obrazy.

Jeżeli chcesz zajmować się wyłącznie formatem grafik, wybierz dedykowaną wtyczkę, taką jak WebP Express. Przed instalacją sprawdź, czy hosting udostępnia wymagane mechanizmy konwersji. Dostępne opcje mogą zależeć od konfiguracji serwera.

Najczęściej stosowane ścieżki to:

• LiteSpeed Cache – rozwiązanie dla stron, które już korzystają z tej wtyczki do cache i optymalizacji.
• WebP Express – dedykowana konwersja obrazów JPG i PNG do WebP.
• Konwersja po stronie serwera – możliwa tylko wtedy, gdy hosting udostępnia odpowiednie narzędzia.
• Automatyczna obsługa nowych plików – obrazy dodawane do biblioteki mediów są konwertowane bez ręcznej pracy.

Jak włączyć WebP w WordPressie krok po kroku?

Wariant z wtyczką WebP Express

To uniwersalna metoda dla osób, które nie chcą zmieniać całego systemu cache. Nazwy opcji mogą się nieznacznie różnić zależnie od wersji wtyczki, ale kolejność działań pozostaje podobna.

Przed masową konwersją wykonaj aktualną kopię zapasową plików oraz bazy danych. W razie problemu pozwoli to przywrócić poprzedni stan witryny.

1. W panelu WordPressa przejdź do sekcji Wtyczki, wybierz Dodaj nową i wyszukaj „WebP Express”. Zainstaluj wtyczkę, a następnie ją aktywuj.
2. Otwórz Ustawienia i wybierz WebP Express.
3. W polu trybu działania wybierz opcję, która serwuje WebP nowym przeglądarkom, a JPG lub PNG pozostałym. W WebP Express jest to zwykle Varied Image Response.
4. Jako folder docelowy wybierz Mingled, jeśli chcesz zapisywać pliki WebP obok oryginałów. Ustaw rozszerzenie pliku na .webp.
5. W sekcji konwersji pozostaw domyślną metodę, jeśli wtyczka wykryła dostępne narzędzie serwera. Ustawienia jakości możesz zmienić, ale niższa waga obrazu może oznaczać widoczną utratę szczegółów.
6. Włącz opcję automatycznej konwersji nowych obrazów podczas przesyłania ich do biblioteki mediów.
7. Zapisz ustawienia. Jeżeli wtyczka udostępnia przycisk zapisujący również reguły pliku .htaccess, użyj go.
8. W sekcji konwersji uruchom Bulk Convert, a następnie rozpocznij konwersję istniejących grafik.

Po zakończeniu procesu wtyczka powinna utworzyć wersje WebP dla obsługiwanych plików. Oryginały JPG i PNG pozostają potrzebne jako fallback dla starszych przeglądarek, dlatego nie usuwaj ich pochopnie.

Wariant z LiteSpeed Cache

LiteSpeed Cache sprawdzi się wtedy, gdy jest już używany na stronie. W tym przypadku konwersja może odbywać się z wykorzystaniem QUIC.cloud, a gotowe pliki są następnie dostarczane odwiedzającym automatycznie.

1. Zainstaluj i aktywuj wtyczkę LiteSpeed Cache w panelu WordPressa.
2. Jeśli wtyczka tego wymaga, połącz witrynę z QUIC.cloud, generując klucz domeny i logując się do istniejącego konta lub tworząc nowe.
3. W menu LiteSpeed Cache przejdź do sekcji Optymalizacja obrazów.
4. Sprawdź ustawienia automatycznej optymalizacji i generowania wersji WebP.
5. Uruchom optymalizację istniejących obrazów. Wtyczka będzie przetwarzać pliki zgodnie z dostępnymi limitami i zadaniami automatycznymi.
6. Po zakończeniu optymalizacji włącz opcję używania zoptymalizowanych plików, zwykle oznaczoną jako Use Optimized Files.

Nie instaluj kilku wtyczek, które jednocześnie konwertują i podmieniają obrazy. Ich reguły mogą się wzajemnie nadpisywać, powodować błędy wyświetlania albo tworzyć niepotrzebne kopie plików.

Jak sprawdzić, czy WordPress serwuje WebP?

Sama obecność plików z rozszerzeniem .webp na serwerze nie gwarantuje, że są one wysyłane przeglądarce. Sprawdź rzeczywiste żądania w narzędziach deweloperskich:

1. Otwórz stronę w Chrome, Edge albo innej nowoczesnej przeglądarce i naciśnij F12.
2. Wybierz zakładkę Network. Jeśli jest pusta, odśwież stronę.
3. W filtrze wpisz „img” albo „webp”, aby ograniczyć listę do obrazów.
4. Kliknij wybrane żądanie grafiki i sprawdź szczegóły. W polu typu pliku lub w nagłówku odpowiedzi powinien pojawić się image/webp albo informacja o formacie webp.
5. Otwórz stronę w trybie prywatnym lub wyczyść cache, jeżeli widzisz stare wyniki.

Warto też ponownie uruchomić test w PageSpeed Insights. Wynik może zależeć nie tylko od formatu obrazów, ale również od ich wymiarów, kompresji, opóźnionego ładowania i pamięci podręcznej.

Lista kontrolna po konfiguracji

Po zakończeniu wdrożenia sprawdź następujące elementy:

• Wtyczka do konwersji jest aktywna i nie dubluje funkcji innego narzędzia.
• Istniejące obrazy zostały objęte masową konwersją.
• Nowe pliki są automatycznie przygotowywane w formacie WebP.
• Oryginały JPG i PNG nadal są dostępne jako fallback.
• W zakładce Network przeglądarka pobiera obrazy jako WebP.
• Po zmianach wyczyszczono cache wtyczki, serwera i przeglądarki.

Jeśli po konwersji grafiki zniknęły, sprawdź uprawnienia do zapisu w katalogu z mediami, reguły .htaccess oraz ustawienia wtyczki cache. Przy problemach z uprawnieniami lub konfiguracją serwera potrzebna może być pomoc administratora hostingu.