Jak dodać Faviconę w WordPress

Od wersji WordPress 4.3 firma Core udostępnia funkcję Site Icon, która przycina, zmienia rozmiar i wstawia za Ciebie odpowiednie tagi <link>. W przypadku standardowych witryn nie jest wymagana żadna wtyczka.

Przesłane ikony są przechowywane w Bibliotece multimediów i można do nich odwoływać się za pomocą funkcji wp_site_icon() z przodu. WordPress generuje wiele rozmiarów po stronie serwera podczas publikowania.

Ta funkcja zastępuje ręczne przesyłanie favicon.ico w przypadku większości blogerów, agencji i sklepów WooCommerce.

Use our favicon generator, PNG to ICO converter, SVG to ICO converter, and live favicon tester to build and verify your icon set, and read the companion guide for a condensed walkthrough.

W wp-admin przejdź do Wygląd → Dostosuj → Tożsamość witryny → Site Icon.

Kliknij Wybierz Site Icon i prześlij kwadrat PNG o wymiarach co najmniej 512 × 512 pikseli. WordPress pokazuje żywego człowieka — wyśrodkuj swoje logo w kwadratowym bezpiecznym obszarze.

Kliknij Opublikuj. Core wyświetla ikonę Apple Touch, różne rozmiary PNG i metatagi przy następnym ładowaniu strony front-end.

W przypadku ikon poszczególnych sekcji lub marek podkatalogów odfiltruj get_site_icon_url() w motywie podrzędnym functions.php.

Przykładowy przypadek użycia: sieć obejmująca wiele lokalizacji, w której każda podwitryna wymaga odrębnego oznaczenia, ale ma ten sam motyw. Zwracaj różne adresy URL w oparciu o blog_id.

Zaawansowane zespoły mogą usunąć z kolejki domyślną meta-ikonę witryny i wydrukować niestandardowe tagi <link> w header.php, ale to duplikowanie rdzenia pracy już dobrze się sprawdza.

Pojedynczy blog: prześlij 512×512 PNG przez Customizer. Gotowe — bez FTP, bez edycji .ico.

Sklep WooCommerce: ten sam przepływ; sprawdź ikonę na stronach kasy i konta, a nie tylko na stronie głównej. Wtyczki buforujące czasami opóźniają CSS, ale rzadko blokują znaczniki ikon.

Headless WordPress: Tagi Site Icon pojawiają się tylko na stronach renderowanych w PHP. Twój interfejs Next.js musi zadeklarować własne tagi <link> w tej architekturze.

Staging → produkcja: prześlij ponownie lub migruj identyfikator multimediów. Adresy URL ikon bezwzględnych w kodzie twardym tylko jeśli rozumiesz unieważnienie pamięci podręcznej CDN.

Popularne wtyczki SEO mogą również ujawniać ustawienie favicon. Unikaj odmiennej konfiguracji wtyczki SEO i Site Icon — wybierz jedno źródło prawdy.

Wtyczki buforujące (WP Rocket, W3 Total Cache) nie powinny blokować plików ikon, ale mogą buforować HTML bez nowych tagów do czasu usunięcia.

Wtyczki Favicon miały sens przed wersją WordPress 4.3. W 2026 r. będą one zbędne, chyba że potrzebujesz animowanej lub zaplanowanej wymiany ikon.

Jakiego typu plik mam przesłać? PNG jest najbezpieczniejszy. WordPress akceptuje JPG, ale tracisz przezroczystość.

Minimalny rozmiar? oficjalnie 512×512; większe źródła zmniejszają skalę.

Czy WordPress tworzy favicon.ico? Emituje rozmiary PNG i metatagi. Przeglądarki nadal czerpią korzyści z umieszczania prawdziwego .ico w katalogu głównym witryny za pośrednictwem hostingu lub motywu podrzędnego.

Wiele lokalizacji: każda witryna ma swój własny Site Icon w swoim własnym Customizer. Administratorzy sieci ustawiają dla poszczególnych witryn, chyba że motyw filtruje adresy URL globalnie.

Przeglądarki buforują favicon oddzielnie od HTML. Po opublikowaniu w WordPress odśwież mocno lub przetestuj w prywatnym oknie.

Dołącz ?ver=2 do adresów URL ikon tylko w przypadku ręcznego przesyłania tagów. Adresy URL Site Icon zawierają argumenty zapytania, które zmieniają się po ponownym przesłaniu.

Wyczyść pamięć podręczną obiektów WordPress i całą sieć CDN (Cloudflare, Jetpack Boost), jeśli HTML nadal odwołuje się do starego adresu URL załącznika.

Jeśli przeprowadziłeś migrację domen, przeszukaj bazę danych pod kątem adresów URL starych ikon w opcjach serializowanych — niektórym importerom brakuje siteicon_id.

Rozmyta ikona po przesłaniu: obraz źródłowy był mniejszy niż 512×512 lub nie był kwadratowy. Zregeneruj się od większego mistrza.

Brak ikony w wynikach Google: Google korzysta z własnej pamięci podręcznej; poproś o ponowne indeksowanie w Search Console po aktualizacji Site Icon.

Ikona na pulpicie, ale nie na iPhonie: iOS wymaga ikony Apple-touch; potwierdź, że Site Icon został opublikowany, a nie tylko zapisany jako wersja robocza w Customizer.

Białe pole wokół logo: przesłano JPG z białym tłem zamiast przezroczystego PNG.

Zarządzane hosty WordPress (WP Engine, Kinsta, SiteGround) pamięć podręczna HTML na brzegu. Po zmianie Site Icon wyczyść wszystkie pamięci podręczne z panelu hosta.

Serwery proxy Cloudflare Orange-Cloud mogą buforować HTML bez buforowania /wp-content/uploads/ Icons — zwykle w porządku, ale usuwane, gdy zmieniają się adresy URL załączników ikon.

Wtyczki wielojęzyczne (WPML, Polylang) domyślnie nie duplikują Site Icon dla każdego języka. Jedna ikona obsługuje wszystkie ustawienia regionalne, chyba że odfiltrujesz adresy URL.

Konfiguracje typu Bedrock lub Headless mogą powodować przeniesienie przesłanych plików. Potwierdź adresy URL multimediów w punkcie HTML frontonu, w którym oczekuje ich Twoja sieć CDN.

Jeśli obsługujesz eksport statyczny (Simply Static, WP2Static), wygeneruj ponownie eksport po zmianie ikony, aby w trybie offline HTML pobierał nowe identyfikatory załączników.

Tylko użytkownicy z możliwością dostosowywania (zwykle administratorzy i redaktorzy w przypadku instalacji standardowych) mogą zmieniać Site Icon. Autorzy nie mogą dokonać zamiany znaku bez podwyższonych praw.

W przypadku wielu witryn superadministratorzy mogą przesyłać motywy obejmujące całą sieć, ale Site Icon pozostaje w poszczególnych witrynach, chyba że kod niestandardowy ma wspólny adres URL załącznika.

Sprawdź motywy administratorów innych firm, które ukrywają wygląd → Dostosuj. Może być konieczne ponowne włączenie Customizer lub użycie głębokiego linku Customizer ?autofocus[sekcja]=title_tagline.

Przekazując witrynę klientowi, udokumentowaj, że zmiany favicon są obecne w programie Customize, a nie samej Bibliotece multimediów — przesłanie tam PNG bez przypisania Site Icon nic nie daje.

Kasa WooCommerce korzysta z tego samego motywu, co reszta sklepu. Site Icon pojawia się automatycznie na stronach koszyka i z podziękowaniami.

Wtyczki członkowskie, które zastępują szablony frontonu, powinny nadal wywoływać funkcję wp_head(), aby uzyskać metadane wyjściowe Site Icon.

Portale klientów z białą etykietą czasami usuwają haczyki związane z brandingiem — sprawdź, czy funkcja dostosowywania nie jest wyłączona w rolach subskrybentów, jeśli klienci przesyłają własne ikony.

Szablony e-maili nie używają Site Icon. Logo e-mail WooCommerce to osobne ustawienie w obszarze Wygląd → Dostosuj → WooCommerce.

Jeśli wcześniej przesłałeś favicon.ico za pomocą protokołu FTP do katalogu głównego sieci Web, Site Icon go nie usunie. Przeglądarki mogą w nieprzewidywalny sposób preferować jedno źródło zamiast drugiego.

Wybierz jedno podejście: albo polegaj na wyjściach Site Icon PNG, albo pozostaw u podstaw ręcznie wykonany ICO z pasującym projektem. Usuń duplikaty po kontroli jakości.

Klasyczne motywy z zakodowanym na stałe linkiem rel=icon w header.php mogą walczyć z rdzeniem Site Icon. Usuń ręczne tagi podczas włączania Site Icon.

Po migracji wyczyść pamięć podręczną i przetestuj przeglądanie prywatne, aby zobaczyć, która ikona wygrywa.

Udokumentuj wybrane podejście w elemencie Runbook, aby następny deweloper nie dodał drugiej sprzecznej wtyczki favicon.